/* Final exact overrides appended after legacy mockup.css */

/* 경기 메인 화면 — Figma 239:8662 */
.play-screen-direct__title {
  top: 137px;
  left: 19px;
  width: 336px;
  height: auto;
  transform: none;
}

.play-screen-direct__choices {
  top: 301px;
  left: 16px;
  right: auto;
  width: 343px;
  display: grid;
  grid-template-columns: repeat(2, 168px);
  gap: 7px;
  justify-content: stretch;
  transform: none;
}

.play-screen-direct__choice {
  min-height: 116px;
  height: 116px;
  padding: 0;
}

.play-screen-direct__choice span {
  font-size: 24px;
  line-height: 30px;
  letter-spacing: -0.96px;
}

.play-screen-direct__sheet {
  left: 0;
  right: 0;
  bottom: 0;
  min-height: 371px;
  height: 371px;
  padding: 30px 45px 28px;
}

.play-screen-direct__summary {
  gap: 4px;
  width: 265px;
}

.play-screen-direct__metric {
  width: 265px;
  font-size: 24px;
  line-height: 30px;
  letter-spacing: -0.96px;
}

.play-screen-direct__links {
  gap: 8px;
  width: 285px;
  margin-top: 28px;
}

.play-screen-direct__links .panel-button--primary {
  width: 285px;
  min-height: 52px;
  height: 52px;
}

/* 승/패 예측 — Figma 243:8740 + picked/blocked previews */
.predict-screen {
  position: relative;
  overflow: hidden;
}

.predict-screen .screen__body {
  padding-top: calc(var(--safe-top) + 148px);
  padding-bottom: 188px;
}

.predict--figma .hero-copy {
  width: 266px;
  margin: 0 auto;
  gap: 8px;
}

.predict-screen .page-title {
  margin: 0;
  font-size: 24px;
  line-height: 30px;
  letter-spacing: -0.96px;
}

.predict-copy {
  margin: 0;
  font-size: 16px;
  line-height: 21px;
  letter-spacing: -0.32px;
  text-align: center;
}

.predict-meta {
  width: 344px;
  margin: 18px auto 0;
  align-items: center;
  gap: 12px;
}

.predict-meta__note {
  margin: 0;
}

.predict-toggle {
  gap: 8px;
  align-items: center;
}

.predict-board {
  position: relative;
  width: 343px;
  margin: 8px auto 0;
  border-radius: 8px 8px 0 0;
}

.predict-list {
  padding-bottom: 108px;
}

.predict-card {
  padding: 16px 0 14px;
}

.predict-card__head,
.predict-row,
.predict-locked-card {
  width: 285px;
}

.predict-card__head {
  min-height: 32px;
}

.predict-card__badge {
  min-width: 82px;
  padding: 0 12px;
  border-radius: 8px;
}

.predict-card__chevron::before {
  top: 6px;
}

.predict-option {
  padding: 0 14px;
}

.predict-option__team {
  position: relative;
}

.predict-option__team--picked {
  justify-content: flex-start;
}

.predict-option__team--picked img {
  opacity: 0.18;
}

.predict-option__label--picked {
  width: 100%;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
  line-height: 21px;
  letter-spacing: -0.36px;
  text-align: center;
}

.predict-option.is-picked {
  background: #4cc7f1;
}

.predict-option.is-picked .predict-option__label {
  color: #fff;
}

.predict-option.is-picked .predict-option__team img {
  opacity: 0.18;
}

.predict-screen .screen__footer {
  position: absolute;
  inset: auto 0 0;
  padding: 30px 45px 24px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.85) 18%, #fff 42%);
  backdrop-filter: blur(10px);
}

.predict-screen .screen__footer .cta {
  width: 285px;
  height: 52px;
  min-height: 52px;
}

.predict-footer-note {
  margin-top: 8px;
  text-align: center;
}

.predict-screen--picked .predict-list,
.predict-screen--blocked .predict-list {
  padding-bottom: 144px;
}

.predict-screen--blocked .predict-meta {
  margin-top: 14px;
}

.predict-history-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 311px;
  min-height: 53px;
  margin: 0 auto;
  color: #fff;
  border-bottom: 1px solid #8c8c8c;
}

.predict-history-row__date {
  font-size: 14px;
  font-weight: 300;
  line-height: 20px;
  letter-spacing: -0.56px;
}

.predict-history-row__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 86px;
  height: 32px;
  padding: 0 10px;
  border-radius: 8px;
  color: #fff;
  font-size: 16px;
  font-weight: 500;
  line-height: 21px;
  letter-spacing: -0.32px;
}

.predict-history-row__badge--success {
  background: #2f70ff;
}

.predict-history-row__badge--failure {
  background: #ff3b30;
}

.predict-history-row__chevron {
  position: relative;
  width: 24px;
  height: 24px;
}

.predict-history-row__chevron::before {
  content: "";
  position: absolute;
  top: 7px;
  left: 7px;
  width: 8px;
  height: 8px;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(45deg);
}

.predict-screen--blocked .predict-card.is-complete .predict-card__badge {
  background: #00b4ed;
}

.predict-screen--blocked .predict-card {
  padding-top: 15px;
}

.predict-screen--blocked .predict-row {
  background: #8d8d8d;
}

.predict-screen--blocked .predict-option:not(.is-picked) {
  background: #8d8d8d;
}

/* 선발 포지션 예측 — Figma 260:47621 / 260:48980 */
.lineup-screen {
  position: relative;
  overflow: hidden;
}

.lineup-screen .screen__body {
  padding-top: calc(var(--safe-top) + 148px);
  padding-bottom: 168px;
}

.lineup-screen .page-title {
  margin: 0;
  font-size: 24px;
  line-height: 30px;
  letter-spacing: -0.96px;
}

.lineup-copy {
  width: 300px;
  margin: 8px auto 0;
  font-size: 16px;
  line-height: 21px;
  letter-spacing: -0.32px;
}

.lineup-field {
  width: 343px;
  height: 340px;
  margin: 34px auto 0;
}

.lineup-field__diamond {
  inset: auto 0 0;
  height: 306px;
}

.lineup-badge {
  right: 3px;
  bottom: 69px;
  width: auto;
  height: auto;
  font-size: 22px;
  line-height: 1;
}

.lineup-card-strip {
  width: 343px;
  margin: 34px auto 0;
  padding-bottom: 0;
}

.screen__footer--lineup {
  position: absolute;
  inset: auto 0 0;
  height: 82px;
  background: #0068b7;
}

.screen__footer--lineup .cta {
  width: 100%;
  min-height: 82px;
  height: 82px;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

/* 랭킹 — Figma 198:4260 */
.ranking {
  position: relative;
  overflow: hidden;
}

.ranking__hero {
  height: 452px;
}

.ranking-podium--primary {
  top: 156px;
}

.ranking-podium--secondary {
  top: 188px;
  left: 33px;
}

.ranking-podium--tertiary {
  top: 222px;
  right: 33px;
}

.ranking__back {
  top: 387px;
  left: 13px;
}

.ranking__sheet {
  position: absolute;
  inset: auto 0 0;
  height: 360px;
  padding: 28px 16px 24px;
}

.ranking-row + .ranking-row {
  margin-top: 0;
}

/* 경험 공유 — Figma 260:53930 / 269:30865 / 278:96148 / 284:27729 / 284:31372 / 284:31436 */
.community-screen,
.community-me {
  position: relative;
  overflow: hidden;
}

.community-screen__body {
  padding-top: calc(var(--safe-top) + 148px);
  padding-bottom: 176px;
}

.community-screen--detail .community-screen__body {
  padding-bottom: 176px;
}

.community-screen .page-title {
  width: 312px;
  margin: 0 auto;
  font-size: 24px;
  line-height: 30px;
  letter-spacing: -0.96px;
}

.community-screen__lead {
  width: 252px;
  margin: 8px auto 0;
  font-size: 16px;
  line-height: 21px;
  letter-spacing: -0.32px;
}

.community-grid--figma {
  width: 343px;
  margin: 24px auto 0;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 8px;
}

.community-tile--figma {
  min-height: 206px;
  padding: 6px 6px 8px;
}

.community-tile--figma .community-tile__photo {
  height: 97px;
}

.community-tile--figma strong {
  min-height: 50px;
}

.community-card--detail {
  width: 343px;
  margin: 24px auto 0;
  padding: 12px 8px 10px;
}

.community-card--detail .community-card__photo {
  height: 267px;
}

.community-screen .screen__footer--community {
  position: absolute;
  inset: auto 45px 52px;
  padding: 0;
  background: transparent;
}

.community-screen .screen__footer--community .cta {
  width: 285px;
  height: 52px;
  min-height: 52px;
}

.community-screen__notice {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 14px;
  margin: 0;
  text-align: center;
}

.community-me__back {
  top: calc(var(--safe-top) + 34px);
  left: 16px;
}

.community-me__body {
  padding-top: calc(var(--safe-top) + 122px);
  padding-bottom: 168px;
}

.community-me .page-title {
  width: 285px;
  margin: 0 auto 28px;
  font-size: 24px;
  line-height: 30px;
  letter-spacing: -0.96px;
}

.community-me__field,
.community-me__editor,
.community-me__upload {
  width: 343px;
  margin-left: auto;
  margin-right: auto;
}

.community-me__field--title {
  gap: 10px;
}

.community-me__title-input {
  padding: 0 0 12px;
}

.community-me__editor {
  margin-top: 24px;
}

.community-me__textarea {
  min-height: 260px;
  padding: 18px 16px;
}

.community-me__editor p {
  margin-top: 6px;
}

.community-me__upload {
  width: 80px;
  height: 80px;
  margin-top: 20px;
  margin-left: 16px;
  margin-right: auto;
}

.community-me .screen__footer {
  position: absolute;
  inset: auto 45px 20px;
  padding: 0;
  background: transparent;
}

.community-me .screen__footer .cta {
  width: 285px;
  height: 52px;
  min-height: 52px;
}

.community-me__notice {
  margin-top: 8px;
  text-align: center;
}

.community-action-sheet {
  left: 0;
  right: 0;
  bottom: 0;
  width: auto;
  padding: 0 0 12px;
}

.community-action-sheet__group {
  width: calc(100% - 24px);
  margin: 0 auto;
}

.community-action-sheet__group button,
.community-action-sheet__cancel {
  min-height: 59px;
}

.community-action-sheet__cancel {
  width: calc(100% - 24px);
  margin: 12px auto 0;
}

.community-confirm-modal {
  width: 285px;
  padding: 36px 16px 0;
}

.community-confirm-modal__actions {
  padding: 20px 0 24px;
}

.community-success-toast {
  bottom: 104px;
}

/* 승/패 예측 화면 — Figma 243:8740 */
.predict-screen {
  overflow: hidden;
}

.predict-screen .screen__body {
  position: relative;
  min-height: 812px;
  padding: 0;
}

.predict--figma {
  padding-top: 0;
}

.predict--figma .hero-copy {
  position: absolute;
  top: 148px;
  left: 54px;
  width: 266px;
  margin: 0;
  gap: 8px;
}

.predict-screen .page-title {
  width: 108px;
  margin: 0 auto;
}

.predict-copy {
  width: 266px;
  margin: 0;
  font-size: 16px;
  line-height: 21px;
  letter-spacing: -0.32px;
  text-align: center;
}

.predict-meta {
  position: absolute;
  top: 248px;
  left: 15px;
  width: 344px;
  margin: 0;
  align-items: center;
  justify-content: space-between;
  gap: 0;
}

.predict-meta__note {
  margin: 0;
}

.predict-toggle {
  width: 156px;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.predict-toggle span {
  text-align: right;
}

.predict-board {
  position: absolute;
  top: 280px;
  left: 16px;
  width: 343px;
  height: 532px;
  margin: 0;
  border-radius: 8px 8px 0 0;
}

.predict-list {
  height: 100%;
  overflow: hidden;
}

.predict-card {
  padding: 15px 0;
}

.predict-card__head,
.predict-row,
.predict-locked-card {
  width: 285px;
}

.predict-card__head {
  min-height: 32px;
}

.predict-card__head > span {
  flex: 1 1 auto;
}

.predict-card__status {
  flex: 0 0 auto;
}

.predict-card__badge {
  width: 80px;
  min-width: 80px;
  padding: 0;
}

.predict-option {
  min-height: 48px;
  padding: 0 12px;
}

.predict-option__team {
  align-items: center;
  gap: 10px;
}

.predict-option__label {
  flex: 1 1 auto;
}

.predict-option:last-child .predict-option__label {
  text-align: right;
}

.predict-locked-card {
  min-height: 48px;
}

.predict-history-row {
  display: grid;
  grid-template-columns: 1fr auto 24px;
  align-items: center;
  min-height: 58px;
  padding: 0 15px 0 17px;
  border-bottom: 1px solid #8c8c8c;
  color: #fff;
}

.predict-history-row__date {
  font-size: 14px;
  font-weight: 300;
  line-height: 20px;
  letter-spacing: -0.56px;
}

.predict-history-row__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 80px;
  height: 32px;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 500;
  line-height: 21px;
  letter-spacing: -0.32px;
}

.predict-history-row__badge--success {
  background: #3f6cff;
}

.predict-history-row__badge--failure {
  background: #ff4343;
}

.predict-history-row__chevron {
  position: relative;
  width: 24px;
  height: 24px;
}

.predict-history-row__chevron::before {
  content: "";
  position: absolute;
  top: 7px;
  left: 7px;
  width: 8px;
  height: 8px;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(225deg);
}

.predict-screen .screen__footer {
  position: absolute;
  top: 670px;
  left: 45px;
  width: 285px;
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  z-index: 3;
}

.predict-screen .screen__footer .cta {
  width: 285px;
  min-height: 52px;
  height: 52px;
  border-radius: 8px;
}

.predict-footer-note {
  width: 159px;
  margin: 0;
  color: #ff4343;
  text-align: center;
}

/* 포지션 예측 화면 — Figma 260:47621 */
.lineup-screen {
  overflow: hidden;
}

.lineup-screen .screen__body {
  position: relative;
  min-height: 812px;
  padding: 0;
}

.lineup--figma {
  padding-top: 0;
  padding-bottom: 82px;
}

.lineup-screen .page-title {
  position: absolute;
  top: 148px;
  left: 50%;
  margin: 0;
  transform: translateX(-50%);
}

.lineup-copy {
  position: absolute;
  top: 186px;
  left: 54px;
  width: 266px;
  margin: 0;
}

.lineup-field {
  position: absolute;
  top: 245px;
  left: 16px;
  width: 343px;
  height: 371px;
  margin: 0;
}

.lineup-field__diamond {
  inset: auto 0 31px;
  height: 306px;
}

.lineup-slot {
  width: 54px;
  height: 86px;
}

.lineup-slot--cf {
  top: 0;
}

.lineup-slot--lf {
  top: 47px;
  left: 20px;
}

.lineup-slot--rf {
  top: 47px;
  right: 18px;
}

.lineup-slot--ss {
  top: 82px;
  left: 83px;
}

.lineup-slot--2b {
  top: 82px;
  right: 82px;
}

.lineup-slot--p {
  top: 146px;
}

.lineup-slot--3b {
  top: 170px;
  left: 44px;
}

.lineup-slot--1b {
  top: 170px;
  right: 43px;
}

.lineup-slot--dh {
  top: 257px;
  left: 27px;
}

.lineup-slot--c {
  top: 257px;
}

.lineup-slot.is-assigned {
  padding: 0;
  background: transparent;
  clip-path: none;
  box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
}

.lineup-slot.is-assigned span {
  display: none;
}

.lineup-slot__card-image {
  display: block;
  width: 54px;
  height: 86px;
  border-radius: 4px;
  object-fit: cover;
}

.lineup-badge {
  right: 11px;
  bottom: 28px;
  width: 80px;
  height: 80px;
}

.lineup-badge__logo {
  display: block;
  width: 80px;
  height: 80px;
  object-fit: contain;
}

.lineup-card-strip {
  position: absolute;
  top: 616px;
  left: 16px;
  width: 343px;
  margin: 0;
  padding-bottom: 0;
}

.lineup-card-option {
  flex: 0 0 54px;
  width: 54px;
  min-width: 54px;
}

.lineup-card-option img {
  width: 54px;
  height: 86px;
  object-fit: cover;
}

.lineup-card-option span {
  display: none;
}

.screen__footer--lineup {
  position: absolute;
  top: 730px;
  left: 0;
  right: 0;
  height: 82px;
}

.screen__footer--lineup .cta {
  width: 100%;
  min-height: 82px;
  height: 82px;
}

/* 랭킹 화면 — Figma 198:4260 */
.ranking__hero {
  height: 452px;
}

.ranking__back {
  left: 0;
  bottom: 41px;
  width: 24px;
  height: 24px;
}

.ranking-podium {
  width: 109px;
}

.ranking-podium__banner {
  width: 109px;
  height: 152px;
  padding: 12px 0 0;
}

.ranking-podium strong {
  font-size: 24px;
  line-height: 30px;
  letter-spacing: -0.96px;
}

.ranking-podium span {
  margin-top: 4px;
  font-size: 12px;
  line-height: 16px;
  letter-spacing: 0;
}

.ranking-podium em {
  margin-top: 0;
  font-size: 12px;
  line-height: 16px;
  letter-spacing: 0;
}

.ranking-podium img {
  width: 44px;
  height: auto;
  margin-top: -2px;
}

.ranking-podium--primary {
  top: 157px;
  left: 133px;
}

.ranking-podium--secondary {
  top: 215px;
  left: 8px;
}

.ranking-podium--tertiary {
  top: 246px;
  right: 8px;
  left: auto;
}

.ranking__sheet {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 360px;
  padding: 29px 16px 30px;
}

.ranking-row {
  min-height: 30px;
  gap: 8px;
}

.ranking-row + .ranking-row {
  margin-top: 12px;
}

.ranking-row__rank {
  width: 20px;
}

.ranking-row__team img {
  width: 30px;
  height: 30px;
}

.ranking-row__name,
.ranking-row__points {
  font-size: 16px;
  line-height: 21px;
  letter-spacing: -0.32px;
}

.ranking__sheet .pager {
  margin-top: 28px;
}

/* 승/패 예측 화면 — Figma 243:8740 */
.predict-screen {
  position: relative;
}

.predict-screen .screen__body {
  position: relative;
  min-height: 812px;
  padding-top: 0;
  padding-bottom: 0;
}

.predict--figma {
  padding-top: 0;
}

.predict--figma .hero-copy {
  position: absolute;
  top: 148px;
  left: 54px;
  width: 266px;
  margin: 0;
  gap: 8px;
}

.predict-screen .page-title {
  width: 108px;
  margin: 0 auto;
  font-size: 24px;
  line-height: 30px;
  letter-spacing: -0.96px;
}

.predict-copy {
  width: 266px;
  margin: 0 auto;
  font-size: 16px;
  line-height: 21px;
  letter-spacing: -0.32px;
  text-align: center;
}

.predict-meta {
  position: absolute;
  top: 248px;
  left: 15px;
  width: 344px;
  margin: 0;
  gap: 0;
  align-items: center;
  justify-content: space-between;
}

.predict-meta__note {
  font-size: 12px;
  line-height: 16px;
  letter-spacing: -0.24px;
}

.predict-toggle {
  width: 156px;
  justify-content: space-between;
  gap: 0;
  font-size: 12px;
  line-height: 16px;
  letter-spacing: -0.24px;
}

.predict-toggle span {
  flex: 1 1 auto;
}

.predict-board {
  position: absolute;
  top: 280px;
  left: 16px;
  width: 343px;
  margin: 0;
  border-radius: 8px;
}

.predict-list {
  max-height: 532px;
  overflow: hidden;
}

.predict-card {
  padding: 16px 0 15px;
}

.predict-card__head,
.predict-row,
.predict-locked-card {
  width: 285px;
}

.predict-screen .screen__footer {
  position: absolute;
  top: 670px;
  left: 45px;
  width: 285px;
  padding: 0;
  background: none;
  z-index: 2;
}

.predict-screen .screen__footer .cta {
  width: 285px;
  min-height: 52px;
  height: 52px;
}

.predict-footer-note {
  width: 159px;
  margin: 12px auto 0;
  text-align: center;
}

/* 선발 포지션 예측 화면 — Figma 260:47621 */
.lineup-screen {
  position: relative;
}

.lineup-screen .screen__body {
  position: relative;
  min-height: 812px;
  padding-top: 0;
  padding-bottom: 0;
}

.lineup--figma {
  padding-top: 0;
}

.lineup-screen .page-title {
  position: absolute;
  top: 148px;
  left: 50%;
  width: 156px;
  margin: 0;
  transform: translateX(-50%);
}

.lineup-copy {
  position: absolute;
  top: 186px;
  left: 33px;
  width: 309px;
  margin: 0;
  text-align: center;
}

.lineup-field {
  position: absolute;
  top: 245px;
  left: 16px;
  width: 343px;
  height: 343px;
  margin: 0;
}

.lineup-field__diamond {
  inset: 31px 0 6px;
  height: 306px;
}

.lineup-slot--cf {
  top: 0;
}

.lineup-slot--lf {
  top: 47px;
  left: 20px;
}

.lineup-slot--rf {
  top: 47px;
  right: 2px;
}

.lineup-slot--ss {
  top: 82px;
  left: 83px;
}

.lineup-slot--2b {
  top: 82px;
  right: 82px;
}

.lineup-slot--p {
  top: 146px;
}

.lineup-slot--3b {
  top: 170px;
  left: 44px;
}

.lineup-slot--1b {
  top: 170px;
  right: 29px;
}

.lineup-slot--dh {
  top: 257px;
  left: 27px;
}

.lineup-slot--c {
  top: 257px;
}

.lineup-badge {
  top: 263px;
  left: 263px;
  right: auto;
  bottom: auto;
  width: 80px;
  height: 80px;
}

.lineup-badge__logo {
  display: block;
  width: 80px;
  height: 80px;
  object-fit: contain;
}

.lineup-card-strip {
  position: absolute;
  top: 616px;
  left: 16px;
  width: 343px;
  margin: 0;
  padding-bottom: 0;
}

.screen__footer--lineup {
  position: absolute;
  top: 730px;
  left: 0;
  right: 0;
  bottom: auto;
  width: 375px;
}

.screen__footer--lineup .cta {
  width: 375px;
  min-height: 82px;
  height: 82px;
}

/* 랭킹 화면 — Figma 198:4260 */
.ranking {
  position: relative;
}

.ranking__hero {
  height: 452px;
}

.ranking-podium {
  width: 109px;
}

.ranking-podium__banner {
  width: 109px;
  height: 152px;
  padding: 14px 8px 39px;
}

.ranking-podium strong {
  font-size: 24px;
  line-height: 30px;
  letter-spacing: -0.96px;
}

.ranking-podium span {
  font-size: 27px;
  line-height: 34px;
  letter-spacing: -1.08px;
}

.ranking-podium em {
  font-size: 13px;
  line-height: 17px;
  letter-spacing: -0.26px;
}

.ranking-podium img {
  width: 54px;
}

.ranking-podium--primary {
  top: 157px;
  left: 133px;
}

.ranking-podium--secondary {
  top: 215px;
  left: 16px;
}

.ranking-podium--tertiary {
  top: 246px;
  right: 16px;
  left: auto;
}

.ranking__back {
  top: 387px;
  left: 8px;
  bottom: auto;
  width: 24px;
  height: 24px;
}

.ranking__sheet {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 360px;
  padding: 30px 16px 18px;
}

.ranking-row {
  min-height: 51px;
  gap: 12px;
}

.ranking__sheet .pager {
  margin-top: 22px;
}

/* 경험 공유 화면군 — Figma 260:53930 / 269:30865 / 278:96148 / 284:31253 / 284:31372 */
.community-screen,
.community-me {
  position: relative;
}

.community-screen__body {
  position: relative;
  width: 375px;
  min-height: 812px;
  padding: 0;
}

.community-screen .page-title {
  position: absolute;
  top: 148px;
  left: 36px;
  width: 302px;
  margin: 0;
  font-size: 24px;
  line-height: 30px;
  letter-spacing: -0.96px;
}

.community-screen__lead {
  position: absolute;
  top: 186px;
  left: 84px;
  width: 206px;
  margin: 0;
  font-size: 16px;
  line-height: 21px;
  letter-spacing: -0.32px;
  text-align: center;
}

.community-screen--detail .community-screen__lead {
  left: 86px;
  width: 203px;
}

.community-grid--figma {
  position: absolute;
  top: 240px;
  left: 16px;
  width: 343px;
  margin: 0;
  grid-template-columns: repeat(2, 168px);
  gap: 6px;
}

.community-tile--figma {
  min-height: 206px;
  height: 206px;
}

.community-tile__photo {
  height: 126px;
}

.community-card--detail {
  position: absolute;
  top: 240px;
  left: 12px;
  width: 350px;
  min-height: 418px;
  margin: 0;
  padding: 20px 8px;
}

.community-card__head,
.community-card__footer {
  width: 334px;
  margin: 0 auto;
}

.community-card__photo {
  width: 334px;
  height: 270px;
  margin: 22px auto 0;
}

.community-card__footer {
  margin-top: 22px;
}

.community-screen .screen__footer--community {
  position: absolute;
  top: 670px;
  left: 45px;
  width: 285px;
  padding: 0;
  bottom: auto;
}

.community-screen .screen__footer--community .cta {
  width: 285px;
  height: 52px;
}

.community-screen__notice {
  position: absolute;
  top: 734px;
  left: 98px;
  width: 179px;
  margin: 0;
  font-size: 12px;
  line-height: 16px;
  letter-spacing: -0.24px;
  text-align: center;
}

.community-me__back {
  top: 73px;
  left: 16px;
  width: 24px;
  height: 24px;
}

.community-me__body {
  position: relative;
  width: 375px;
  min-height: 812px;
  padding: 0;
}

.community-me .page-title {
  position: absolute;
  top: 148px;
  left: 58px;
  width: 259px;
  margin: 0;
  font-size: 24px;
  line-height: 30px;
  letter-spacing: -0.96px;
}

.community-me__field--title {
  position: absolute;
  top: 203px;
  left: 16px;
  width: 343px;
  margin: 0;
}

.community-me__field strong {
  padding-left: 4px;
}

.community-me__title-input {
  height: 37px;
  padding: 8px 4px;
}

.community-me__editor {
  position: absolute;
  top: 286px;
  left: 16px;
  width: 343px;
  height: 360px;
  margin: 0;
}

.community-me__textarea {
  min-height: 260px;
  padding: 8px;
}

.community-me__editor p {
  margin-top: 4px;
  margin-right: 4px;
}

.community-me__upload {
  position: absolute;
  top: 566px;
  left: 16px;
  width: 80px;
  height: 80px;
  margin: 0;
}

.community-me__upload-preview,
.community-me__upload-preview--sample {
  width: 80px;
  height: 80px;
}

.community-me__upload-icon img {
  width: 24px;
  height: 24px;
}

.community-me__upload-action {
  top: -6px;
  right: -6px;
  bottom: auto;
  width: 24px;
  height: 24px;
}

.community-me__upload-action img {
  width: 24px;
  height: 24px;
}

.community-me .screen__footer {
  position: absolute;
  top: 670px;
  left: 45px;
  width: 285px;
  padding: 0;
  background: none;
}

.community-me .screen__footer .cta {
  width: 285px;
  height: 52px;
}

.community-me__notice {
  width: 262px;
  margin: 12px auto 0;
  font-size: 12px;
  line-height: 16px;
  letter-spacing: -0.24px;
  text-align: center;
}

.community-action-sheet {
  left: 8px;
  right: 8px;
  bottom: 32px;
  width: 359px;
  padding: 0;
}

.community-action-sheet__group {
  gap: 0;
}

.community-action-sheet__group button,
.community-action-sheet__cancel {
  min-height: 60px;
  height: 60px;
}

.community-confirm-modal {
  top: 308px;
  left: 45px;
  width: 285px;
  min-height: 197px;
  padding: 36px 16px 20px;
}

.community-confirm-modal__actions {
  gap: 16px;
  margin-top: 20px;
}

.community-confirm-modal__button {
  width: 109px;
  height: 52px;
}

.community-success-toast {
  left: 73px;
  bottom: 150px;
  width: 229px;
  height: 37px;
  border-radius: 8px;
}

/* 경험 공유 화면군 — exact pass */
.community-screen,
.community-me {
  position: relative;
}

.community-screen__body {
  position: relative;
  width: 375px;
  min-height: 812px;
  padding: 0;
}

.community-screen .page-title {
  position: absolute;
  top: 148px;
  left: 36px;
  width: 302px;
  margin: 0;
  color: #0068b7;
  font-size: 24px;
  font-weight: 700;
  line-height: 30px;
  letter-spacing: -0.96px;
  text-align: center;
}

.community-screen__lead {
  position: absolute;
  top: 186px;
  left: 84px;
  width: 206px;
  margin: 0;
  color: #2a2a2b;
  font-size: 16px;
  font-weight: 300;
  line-height: 21px;
  letter-spacing: -0.32px;
  text-align: center;
}

.community-screen--detail .community-screen__lead {
  left: 86px;
  width: 203px;
}

.community-grid--figma {
  position: absolute;
  top: 240px;
  left: 16px;
  display: grid;
  grid-template-columns: repeat(2, 168px);
  gap: 6px;
  width: 343px;
  margin: 0;
}

.community-tile--figma {
  display: flex;
  flex-direction: column;
  width: 168px;
  height: 206px;
  padding: 8px;
  border: 2px solid #0068b7;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.25);
}

.community-tile--figma .community-tile__photo {
  width: 152px;
  height: 126px;
  margin: 0;
  border-radius: 8px;
  background: rgba(0, 104, 183, 0.4);
  overflow: hidden;
}

.community-tile__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.community-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

.community-placeholder__asset {
  width: 32px;
  height: 32px;
}

.community-tile--figma .community-tile__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  margin-top: 4px;
}

.community-tile--figma .community-tile__meta span,
.community-card__title-row span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  padding: 4px 8px;
  border-radius: 8px;
  background: #e3e3e3;
  color: #8c8c8c;
  font-size: 12px;
  font-weight: 300;
  line-height: 16px;
  letter-spacing: -0.24px;
}

.community-tile__like,
.community-card__close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  padding: 0;
  border: 0;
  background: transparent;
}

.community-card__close {
  width: 24px;
  height: 24px;
}

.community-tile__heart,
.community-card__heart,
.community-card__close img {
  display: inline-flex;
  width: 100%;
  height: 100%;
}

.community-tile__heart img,
.community-card__heart img {
  width: 100%;
  height: 100%;
}

.community-tile--figma strong {
  display: block;
  width: 100%;
  margin-top: 4px;
  color: #2a2a2b;
  font-size: 16px;
  font-weight: 500;
  line-height: 21px;
  letter-spacing: -0.32px;
}

.community-tile__button {
  margin-top: auto;
  width: 100%;
  min-height: 37px;
  border: 0;
  border-radius: 8px;
  background: #0068b7;
  color: #fff;
  font-size: 16px;
  font-weight: 500;
  line-height: 21px;
  letter-spacing: -0.32px;
}

.community-card--detail {
  position: absolute;
  top: 240px;
  left: 12px;
  width: 350px;
  min-height: 418px;
  margin: 0;
  padding: 20px 8px;
  border: 2px solid #0068b7;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.25);
}

.community-card__head,
.community-card__footer {
  width: 334px;
  margin: 0 auto;
}

.community-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.community-card__title-row {
  display: flex;
  align-items: center;
  gap: 8px;
}

.community-card__title-row strong {
  color: #2a2a2b;
  font-size: 16px;
  font-weight: 500;
  line-height: 21px;
  letter-spacing: -0.32px;
}

.community-card__photo {
  width: 334px;
  height: 270px;
  margin: 22px auto 0;
  border-radius: 8px;
  background: rgba(0, 104, 183, 0.4);
  overflow: hidden;
}

.community-card__footer {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 8px;
  margin-top: 22px;
}

.community-card__footer p {
  flex: 1 1 auto;
  margin: 0;
  color: #2a2a2b;
  font-size: 14px;
  font-weight: 300;
  line-height: 20px;
  letter-spacing: -0.56px;
}

.community-card__like {
  display: inline-flex;
  align-items: flex-end;
  gap: 0;
  padding: 0;
  border: 0;
  background: transparent;
}

.community-card__like span {
  color: #2a2a2b;
  font-size: 14px;
  font-weight: 300;
  line-height: 20px;
  letter-spacing: -0.56px;
}

.community-card__heart {
  width: 32px;
  height: 32px;
}

.community-screen .screen__footer--community {
  position: absolute;
  top: 670px;
  left: 45px;
  width: 285px;
  padding: 0;
  bottom: auto;
  background: none;
}

.community-screen .screen__footer--community .cta {
  width: 285px;
  height: 52px;
  min-height: 52px;
}

.community-screen__notice {
  position: absolute;
  top: 734px;
  left: 98px;
  width: 179px;
  margin: 0;
  color: #ff0000;
  font-size: 12px;
  font-weight: 300;
  line-height: 16px;
  letter-spacing: -0.24px;
  text-align: center;
}

.community-me__back {
  position: absolute;
  top: 74px;
  left: 16px;
  width: 24px;
  height: 24px;
  padding: 0;
  border: 0;
  background: transparent;
}

.community-me__back img {
  width: 24px;
  height: 24px;
}

.community-me__body {
  position: relative;
  width: 375px;
  min-height: 812px;
  padding: 0;
}

.community-me .page-title {
  position: absolute;
  top: 148px;
  left: 58px;
  width: 259px;
  margin: 0;
  color: #0068b7;
  font-size: 24px;
  font-weight: 700;
  line-height: 30px;
  letter-spacing: -0.96px;
  text-align: center;
}

.community-me__field--title {
  position: absolute;
  top: 203px;
  left: 16px;
  width: 343px;
  margin: 0;
}

.community-me__field strong {
  display: block;
  padding-left: 4px;
  color: #2a2a2b;
  font-size: 16px;
  font-weight: 500;
  line-height: 21px;
  letter-spacing: -0.32px;
}

.community-me__title-input {
  height: 37px;
  padding: 8px 4px;
  border-radius: 0;
  border-width: 0 0 1px;
  border-color: #8c8c8c;
  color: #2a2a2b;
  font-size: 16px;
  font-weight: 300;
  line-height: 21px;
  letter-spacing: -0.32px;
}

.community-me__title-input::placeholder,
.community-me__textarea::placeholder {
  color: #8c8c8c;
}

.community-me__editor {
  position: absolute;
  top: 286px;
  left: 16px;
  width: 343px;
  height: 360px;
  margin: 0;
}

.community-me__textarea {
  min-height: 260px;
  padding: 8px;
  border-radius: 8px;
  background: #f0f0f0;
  color: #2a2a2b;
  font-size: 16px;
  font-weight: 300;
  line-height: 21px;
  letter-spacing: -0.32px;
}

.community-me__editor p {
  margin-top: 4px;
  margin-right: 4px;
  color: #8c8c8c;
  font-size: 12px;
  font-weight: 300;
  line-height: 16px;
  letter-spacing: -0.24px;
}

.community-me__upload {
  position: absolute;
  top: 566px;
  left: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 80px;
  height: 80px;
  margin: 0;
  border: 2px solid #b7b7b7;
  border-radius: 8px;
  background: #fff;
  overflow: visible;
}

.community-me__upload-icon img {
  width: 24px;
  height: 24px;
}

.community-me__upload-preview,
.community-me__upload-preview--sample {
  width: 80px;
  height: 80px;
  border-radius: 8px;
  object-fit: cover;
}

.community-me__upload-action {
  position: absolute;
  top: -6px;
  right: -6px;
  width: 24px;
  height: 24px;
  padding: 0;
  border: 0;
  background: transparent;
}

.community-me__upload-action img {
  width: 24px;
  height: 24px;
}

.community-me .screen__footer {
  position: absolute;
  top: 670px;
  left: 45px;
  width: 285px;
  padding: 0;
  background: none;
}

.community-me .screen__footer .cta {
  width: 285px;
  height: 52px;
  min-height: 52px;
}

.community-me__notice {
  width: 262px;
  margin: 12px auto 0;
  color: #ff0000;
  font-size: 12px;
  font-weight: 300;
  line-height: 16px;
  letter-spacing: -0.24px;
  text-align: center;
}

.community-sheet-backdrop,
.modal-backdrop--community {
  position: absolute;
  inset: 0;
  border: 0;
  background: rgba(0, 0, 0, 0.5);
}

.community-action-sheet {
  position: absolute;
  left: 8px;
  right: 8px;
  bottom: 32px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 359px;
  padding: 0;
  background: none;
}

.community-action-sheet__group {
  overflow: hidden;
  border-radius: 13px;
  backdrop-filter: blur(11px);
  background: rgba(42, 42, 43, 0.4);
}

.community-action-sheet__group button,
.community-action-sheet__cancel {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 60px;
  height: 60px;
  padding: 18px 16px;
  border: 0;
  background: rgba(42, 42, 43, 0.4);
  color: #fff;
  font-family: "Apple SD Gothic Neo", "Apple SD Gothic", "Noto Sans KR", sans-serif;
  font-size: 20px;
  font-weight: 600;
  line-height: 24px;
  letter-spacing: 0.38px;
}

.community-action-sheet__separator {
  display: block;
  width: 100%;
  height: 1px;
}

.community-action-sheet__cancel {
  border-radius: 13px;
  backdrop-filter: blur(40px);
  font-weight: 700;
}

.community-confirm-modal {
  position: absolute;
  top: 308px;
  left: 45px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  width: 285px;
  padding: 36px 0;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
}

.community-confirm-modal__copy {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}

.community-confirm-modal__title {
  margin: 0;
  color: #2a2a2b;
  font-size: 16px;
  font-weight: 500;
  line-height: 21px;
  letter-spacing: -0.32px;
  text-align: center;
}

.community-confirm-modal__caption {
  margin: 0;
  color: #ff0000;
  font-size: 14px;
  font-weight: 300;
  line-height: 20px;
  letter-spacing: -0.56px;
  text-align: center;
}

.community-confirm-modal__actions {
  display: flex;
  gap: 16px;
  margin: 0;
}

.community-confirm-modal__button {
  width: 109px;
  height: 52px;
  border: 0;
  border-radius: 8px;
  background: #f0f0f0;
  color: #2a2a2b;
  font-size: 16px;
  font-weight: 500;
  line-height: 21px;
  letter-spacing: -0.32px;
}

.community-confirm-modal__button.is-primary {
  background: #0068b7;
  color: #fff;
}

.community-success-toast {
  position: absolute;
  left: 73px;
  top: 625px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 37px;
  padding: 8px 20px;
  border-radius: 8px;
  backdrop-filter: blur(2px);
  background: rgba(0, 0, 0, 0.4);
  color: #f7f7f7;
  font-size: 16px;
  font-weight: 300;
  line-height: 21px;
  letter-spacing: -0.32px;
  text-align: center;
  white-space: nowrap;
}

/* 승/패 예측 화면군 — exact pass */
.predict-screen {
  position: relative;
  overflow: hidden;
}

.predict-screen .screen__body {
  position: relative;
  width: 375px;
  min-height: 812px;
  padding: 0;
}

.predict--figma .hero-copy {
  position: absolute;
  top: 148px;
  left: 54px;
  width: 266px;
  margin: 0;
  gap: 0;
}

.predict-screen .page-title {
  margin: 0;
  color: #0068b7;
  font-size: 24px;
  font-weight: 700;
  line-height: 30px;
  letter-spacing: -0.96px;
  text-align: center;
}

.predict-copy {
  margin: 8px 0 0;
  color: #2a2a2b;
  font-size: 16px;
  font-weight: 300;
  line-height: 21px;
  letter-spacing: -0.32px;
  text-align: center;
}

.predict-meta {
  position: absolute;
  top: 252px;
  left: 15px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 344px;
  margin: 0;
}

.predict-meta__note {
  margin: 0;
  color: #0068b7;
  font-size: 12px;
  font-weight: 300;
  line-height: 16px;
  letter-spacing: -0.24px;
}

.predict-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #2a2a2b;
  font-size: 16px;
  font-weight: 300;
  line-height: 21px;
  letter-spacing: -0.32px;
}

.predict-board {
  position: absolute;
  top: 280px;
  left: 16px;
  width: 343px;
  height: 532px;
  margin: 0;
  overflow: hidden;
  border-radius: 8px;
}

.predict-list {
  width: 100%;
  height: 100%;
  padding: 0;
}

.predict-card {
  border-radius: 0;
}

.predict-card__head,
.predict-row,
.predict-locked-card {
  width: 311px;
  margin: 0 auto;
}

.predict-card__head {
  min-height: 53px;
}

.predict-card__head > span {
  color: #fff;
  font-size: 14px;
  font-weight: 300;
  line-height: 20px;
  letter-spacing: -0.56px;
}

.predict-card__status {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.predict-card__badge {
  min-width: 86px;
  height: 32px;
  padding: 0 10px;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 500;
  line-height: 21px;
  letter-spacing: -0.32px;
}

.predict-option {
  min-height: 46px;
}

.predict-option__team {
  gap: 8px;
  font-size: 16px;
  font-weight: 500;
  line-height: 21px;
  letter-spacing: -0.32px;
}

.predict-option__label {
  font-size: 16px;
  font-weight: 500;
  line-height: 21px;
  letter-spacing: -0.32px;
}

.predict-history-row {
  width: 311px;
  min-height: 58px;
  margin: 0 auto;
}

.predict-history-row__date {
  color: #fff;
  font-size: 14px;
  font-weight: 300;
  line-height: 20px;
  letter-spacing: -0.56px;
}

.predict-history-row__chevron {
  width: 24px;
  height: 24px;
}

.predict-screen .screen__footer {
  position: absolute;
  top: 670px;
  left: 45px;
  width: 285px;
  padding: 0;
  background: none;
  inset: auto;
}

.predict-screen .screen__footer .cta {
  width: 285px;
  height: 52px;
  min-height: 52px;
}

.predict-footer-note {
  position: absolute;
  top: 734px;
  left: 108px;
  width: 159px;
  margin: 0;
  color: #ff0000;
  font-size: 12px;
  font-weight: 300;
  line-height: 16px;
  letter-spacing: -0.24px;
  text-align: center;
}

/* 선발 포지션 예측 — exact asset pass */
.lineup-screen .screen__body {
  position: relative;
  width: 375px;
  min-height: 812px;
  margin: 0 auto;
  padding: 0;
}

.lineup--figma {
  position: relative;
  width: 375px;
  min-height: 812px;
  margin: 0 auto;
  padding: 0;
}

.lineup-screen .page-title {
  position: absolute;
  top: 148px;
  left: 104px;
  width: 166px;
  margin: 0;
  font-size: 24px;
  line-height: 30px;
  letter-spacing: -0.96px;
}

.lineup-copy {
  position: absolute;
  top: 186px;
  left: 30px;
  width: 314px;
  margin: 0;
  color: #2a2a2b;
  font-size: 16px;
  font-weight: 300;
  line-height: 21px;
  letter-spacing: -0.32px;
  text-align: center;
}

.lineup-field {
  position: absolute;
  top: 245px;
  left: 16px;
  width: 343px;
  height: 343px;
  margin: 0;
}

.lineup-field__diamond {
  display: none;
}

.lineup-field__image {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 343px;
  height: 343px;
  object-fit: fill;
}

.lineup-slot {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 86px;
  padding: 0;
  border: 0;
  background: none;
  box-shadow: none;
}

.lineup-slot span {
  opacity: 0;
}

.lineup-slot--cf { top: 0; left: 50%; transform: translateX(-50%); }
.lineup-slot--lf { top: 47px; left: 20px; }
.lineup-slot--rf { top: 47px; right: 18px; }
.lineup-slot--ss { top: 82px; left: 83px; }
.lineup-slot--2b { top: 82px; right: 82px; }
.lineup-slot--p { top: 146px; left: 50%; transform: translateX(-50%); }
.lineup-slot--3b { top: 170px; left: 44px; }
.lineup-slot--1b { top: 170px; right: 45px; }
.lineup-slot--dh { top: 257px; left: 27px; }
.lineup-slot--c { top: 257px; left: 50%; transform: translateX(-50%); }

.lineup-slot.is-assigned,
.lineup-slot.is-current {
  background: none;
  box-shadow: none;
}

.lineup-badge {
  display: none;
}

.lineup-badge__logo {
  display: block;
  width: 80px;
  height: 80px;
  object-fit: contain;
}

.lineup-card-strip {
  position: absolute;
  top: 616px;
  left: 16px;
  display: flex;
  gap: 4px;
  width: 343px;
  margin: 0;
  padding: 0;
  overflow-x: auto;
  scrollbar-width: none;
}

.lineup-card-option {
  flex: 0 0 54px;
  width: 54px;
}

.lineup-card-option img {
  display: block;
  width: 54px;
  height: 86px;
  border-radius: 4px;
}

.screen__footer--lineup {
  position: absolute;
  top: 730px;
  left: 50%;
  width: 375px;
  padding: 0;
  bottom: auto;
  transform: translateX(-50%);
}

.screen__footer--lineup .cta {
  width: 375px;
  height: 82px;
  min-height: 82px;
}

.lineup-screen--success .modal-backdrop {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding-top: 279px;
}

.modal-card--lineup,
.modal-card--lineup-success {
  width: 285px;
  border-radius: 8px;
}

.modal-card--lineup .modal-card__body {
  padding: 36px 24px 20px;
  gap: 10px;
  background: #fff;
}

.modal-card--lineup .modal-card__title {
  color: #2a2a2b;
  font-size: 16px;
  font-weight: 500;
  line-height: 21px;
  letter-spacing: -0.32px;
  text-align: center;
}

.modal-card--lineup .modal-card__caption--danger {
  margin: 0;
  color: #ff0000;
  font-size: 14px;
  font-weight: 300;
  line-height: 20px;
  letter-spacing: -0.56px;
  text-align: center;
}

.modal-card--lineup-success {
  gap: 0;
}

.modal-card--lineup-success .modal-card__body {
  padding: 36px 24px 20px;
  gap: 12px;
  background: #fff;
}

.modal-card--lineup-success .modal-card__title {
  color: #2a2a2b;
  font-size: 16px;
  font-weight: 500;
  line-height: 21px;
  letter-spacing: -0.32px;
  text-align: center;
}

.modal-card--lineup-success .modal-card__caption--neutral {
  margin: 0;
  color: #8c8c8c;
  font-size: 14px;
  font-weight: 300;
  line-height: 20px;
  letter-spacing: -0.56px;
  text-align: center;
}

.modal-card--lineup-success .modal-card__footer--single {
  min-height: 52px;
}

/* 랭킹 — exact medal asset pass */
.ranking-podium--primary img {
  width: 43px;
  height: 61px;
}

.ranking-podium--secondary img {
  width: 44px;
  height: 62px;
}

.ranking-podium--tertiary img {
  width: 43px;
  height: 61px;
}

.ranking-row {
  width: 343px;
  min-height: 21px;
  margin: 0;
}

.ranking-row__rank {
  flex: 0 0 20px;
  color: #2a2a2b;
  font-size: 16px;
  font-weight: 500;
  line-height: 21px;
  letter-spacing: -0.32px;
}

.ranking-row__team img {
  display: block;
  width: 30px;
  height: 30px;
}

.ranking-row__name,
.ranking-row__points {
  color: #2a2a2b;
  font-size: 16px;
  font-weight: 500;
  line-height: 21px;
  letter-spacing: -0.32px;
}

.ranking-row__points strong {
  color: #0068b7;
  font-weight: 500;
}

/* 경험 공유 — final mismatch cleanup */
.community-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

.community-tile__photo > .community-placeholder,
.community-card__photo > .community-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

.community-placeholder__asset {
  width: 32px !important;
  height: 32px !important;
  flex: 0 0 32px;
  object-fit: contain;
}

.community-screen .screen__footer--community {
  top: auto;
  bottom: 90px;
}

.community-screen__notice {
  top: auto;
  bottom: 42px;
}

.community-confirm-modal {
  left: 45px;
  top: 308px;
  width: 285px;
  padding: 36px 24px 20px;
  transform: none;
}

.community-success-toast {
  left: 50%;
  width: auto;
  min-width: 229px;
  height: auto;
  min-height: 37px;
  transform: translateX(-50%);
}

/* 경험 공유 — final layout pass */
.community-screen .page-title {
  top: 111px;
  left: 36px;
  width: 302px;
}

.community-screen__lead {
  top: 151px;
  left: 84px;
  width: 206px;
}

.community-screen--detail .community-screen__lead {
  left: 80px;
  width: 215px;
}

.community-grid--figma {
  top: 197px;
}

.community-card--detail {
  top: 197px;
  min-height: 394px;
}

.community-card__photo {
  height: 254px;
}

.community-screen .screen__footer--community {
  top: auto;
  bottom: 128px;
  left: 45px;
  width: 285px;
}

.community-screen__notice {
  top: auto;
  bottom: 69px;
  left: 98px;
  width: 179px;
}

.community-tile__photo > .community-placeholder,
.community-card__photo > .community-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

.community-tile__photo > .community-placeholder > .community-placeholder__asset,
.community-card__photo > .community-placeholder > .community-placeholder__asset {
  width: 32px !important;
  height: 32px !important;
  min-width: 32px;
  min-height: 32px;
  object-fit: contain !important;
}

.community-me .page-title {
  top: 111px;
  left: 58px;
  width: 259px;
}

.community-me__field--title {
  top: 159px;
}

.community-me__editor {
  top: 239px;
  height: 290px;
}

.community-me__textarea {
  min-height: 244px;
}

.community-me__upload {
  top: 533px;
}

.community-me .screen__footer {
  top: 632px;
  left: 45px;
  width: 285px;
}

.community-action-sheet {
  bottom: 58px;
}

/* 랭킹 — exact frame 198:4260 */
.ranking {
  position: relative;
  width: 375px;
  max-width: 100%;
  min-height: 812px;
  margin: 0 auto;
  background: #0068b7;
  overflow: hidden;
}

.ranking::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url('../mcp/exact/collection/pattern-tile.png?v=20260415-1');
  background-repeat: repeat;
  background-size: 30px 30px;
  opacity: 0.2;
  pointer-events: none;
}

.ranking .topbar {
  top: calc(var(--safe-top) + 34px);
  left: 50%;
  width: 344px;
  transform: translateX(-50%);
  z-index: 3;
}

.ranking__back {
  position: absolute;
  left: 0;
  top: 387px;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 38px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}

.ranking__back img {
  display: block;
  width: 13.0833px;
  height: 24px;
  opacity: 1;
}

.ranking__hero {
  position: absolute;
  inset: 0 0 auto 0;
  height: 452px;
  z-index: 2;
}

.ranking-podium {
  position: absolute;
  display: block;
  width: 109px;
  height: 152px;
  text-align: initial;
}

.ranking-podium--primary {
  top: 157px;
  left: 133px;
}

.ranking-podium--secondary {
  top: 215px;
  left: 16px;
}

.ranking-podium--tertiary {
  top: 246px;
  left: 250px;
}

.ranking-podium img.ranking-podium__plate {
  position: absolute;
  inset: 0;
  display: block;
  width: 109px;
  height: 152px;
  margin-top: 0;
}

.ranking-podium img.ranking-podium__medal {
  margin-top: 0;
}

.ranking-podium__copy {
  position: absolute;
  top: 12px;
  left: 0;
  right: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  text-align: center;
  white-space: nowrap;
}

.ranking-podium__copy strong {
  margin: 0;
  color: #2a2a2b;
  font-size: 24px;
  font-weight: 700;
  line-height: 30px;
  letter-spacing: -0.96px;
}

.ranking-podium__copy span,
.ranking-podium__copy em {
  margin: 0;
  color: #2a2a2b;
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: 16px;
  letter-spacing: 0;
}

.ranking-podium__copy span b,
.ranking-podium__copy em b {
  color: #0068b7;
  font-weight: 500;
}

.ranking-podium__medal {
  position: absolute;
  display: block;
  z-index: 3;
}

.ranking-podium--primary .ranking-podium__medal {
  top: 91px;
  left: 33px;
  width: 43px;
  height: 61px;
}

.ranking-podium--secondary .ranking-podium__medal {
  top: 90px;
  left: 32px;
  width: 44px;
  height: 62px;
}

.ranking-podium--tertiary .ranking-podium__medal {
  top: 99px;
  left: 33px;
  width: 43px;
  height: 61px;
}

.ranking__sheet {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  width: 375px;
  height: 360px;
  margin: 0 auto;
  padding: 29px 16px 48px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  background: #fff;
  border-radius: 32px 32px 0 0;
  z-index: 1;
}

.ranking-row {
  display: grid;
  grid-template-columns: 20px 30px minmax(0, 1fr) auto;
  align-items: center;
  column-gap: 8px;
  width: 343px;
  min-height: 21px;
  margin: 0;
}

.ranking-row + .ranking-row {
  margin-top: 0;
}

.ranking-row__rank,
.ranking-row__name,
.ranking-row__points {
  color: #2a2a2b;
  font-size: 16px;
  font-weight: 500;
  line-height: 21px;
  letter-spacing: -0.32px;
}

.ranking-row__rank {
  width: 20px;
  text-align: left;
}

.ranking-row__team {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
}

.ranking-row__team img {
  display: block;
  width: 30px;
  height: 30px;
  object-fit: contain;
}

.ranking-row__name {
  min-width: 0;
  white-space: nowrap;
}

.ranking-row__points {
  text-align: right;
}

.ranking-row__points strong {
  color: #0068b7;
  font-weight: 500;
}

.ranking__pager {
  position: absolute;
  left: 50%;
  bottom: 30px;
  width: 68px;
  height: 8px;
  transform: translateX(-50%);
  display: block;
  filter: drop-shadow(0 0 8px rgba(0, 0, 0, 0.5));
}

/* 경기 메인 exact pass — scaled from Figma 239:8662 to current stage width */
.play-screen-direct {
  position: relative !important;
  width: var(--figma-stage-width) !important;
  min-height: var(--mockup-stage-height) !important;
  height: var(--mockup-stage-height) !important;
  margin: 0 auto !important;
  overflow: hidden !important;
  background: #05142a !important;
  color: #fff !important;
}

.play-screen-direct__backdrop {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
}

.play-screen-direct__backdrop img {
  position: absolute !important;
  top: 0 !important;
  left: 50% !important;
  width: calc(457px * var(--figma-stage-scale)) !important;
  height: calc(812px * var(--figma-stage-scale)) !important;
  transform: translateX(-50%) !important;
  object-fit: cover !important;
  object-position: center top !important;
}

.play-screen-direct .topbar {
  top: calc(var(--safe-top) + (70px * var(--figma-stage-scale))) !important;
  width: calc(344px * var(--figma-stage-scale)) !important;
  grid-template-columns:
    calc(24px * var(--figma-stage-scale))
    calc(132px * var(--figma-stage-scale))
    calc(24px * var(--figma-stage-scale)) !important;
  gap: calc(82px * var(--figma-stage-scale)) !important;
  z-index: 4 !important;
}

.play-screen-direct .topbar__button,
.play-screen-direct .topbar__slot,
.play-screen-direct .topbar__icon {
  width: calc(24px * var(--figma-stage-scale)) !important;
  height: calc(24px * var(--figma-stage-scale)) !important;
}

.play-screen-direct .topbar__brand--dark,
.play-screen-direct .topbar__brand-lockup--dark {
  width: calc(128px * var(--figma-stage-scale)) !important;
  min-width: calc(128px * var(--figma-stage-scale)) !important;
  height: calc(20px * var(--figma-stage-scale)) !important;
}

.play-screen-direct .topbar__brand-image {
  height: calc(20px * var(--figma-stage-scale)) !important;
}

.play-screen-direct__title {
  position: absolute;
  top: calc(137px * var(--figma-stage-scale)) !important;
  left: 50% !important;
  width: calc(336px * var(--figma-stage-scale)) !important;
  height: auto !important;
  transform: translateX(-50%) !important;
  z-index: 3 !important;
}

.play-screen-direct__choices {
  position: absolute;
  top: calc(301px * var(--figma-stage-scale)) !important;
  left: 50% !important;
  right: auto !important;
  width: calc(343px * var(--figma-stage-scale)) !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: calc(7px * var(--figma-stage-scale)) !important;
  justify-content: stretch !important;
  transform: translateX(-50%) !important;
  z-index: 3 !important;
}

.play-screen-direct__choice {
  box-sizing: border-box !important;
  min-height: 0 !important;
  height: calc(116px * var(--figma-stage-scale)) !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: calc(8px * var(--figma-stage-scale)) !important;
  background: #fff !important;
  color: #2a2a2b !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
}

.play-screen-direct__choice span {
  font-size: calc(24px * var(--figma-stage-scale)) !important;
  font-weight: 700 !important;
  line-height: calc(30px * var(--figma-stage-scale)) !important;
  letter-spacing: calc(-0.96px * var(--figma-stage-scale)) !important;
  text-align: center !important;
}

.play-screen-direct__sheet {
  position: absolute;
  top: auto !important;
  left: 50% !important;
  right: auto !important;
  bottom: 0 !important;
  width: var(--figma-stage-width) !important;
  box-sizing: border-box !important;
  min-height: 0 !important;
  height: calc(371px * var(--figma-stage-scale)) !important;
  padding: calc(29px * var(--figma-stage-scale)) calc(16px * var(--figma-stage-scale)) calc(30px * var(--figma-stage-scale)) !important;
  border-radius: calc(32px * var(--figma-stage-scale)) calc(32px * var(--figma-stage-scale)) 0 0 !important;
  background: #fff !important;
  color: #2a2a2b !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  transform: translateX(-50%) !important;
  z-index: 2 !important;
}

.play-screen-direct__summary {
  width: calc(265px * var(--figma-stage-scale)) !important;
  margin: 0 auto !important;
  display: grid !important;
  justify-items: center !important;
  gap: calc(4px * var(--figma-stage-scale)) !important;
}

.play-screen-direct__metric {
  width: calc(265px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
  color: #2a2a2b !important;
  font-size: calc(20px * var(--figma-stage-scale)) !important;
  font-weight: 500 !important;
  line-height: calc(26px * var(--figma-stage-scale)) !important;
  letter-spacing: calc(-0.4px * var(--figma-stage-scale)) !important;
  text-align: center !important;
}

.play-screen-direct__metric + .play-screen-direct__metric {
  margin-top: 0 !important;
}

.play-screen-direct__metric strong {
  color: #0068b7 !important;
}

.play-screen-direct__links {
  width: calc(285px * var(--figma-stage-scale)) !important;
  margin: calc(28px * var(--figma-stage-scale)) auto 0 !important;
  display: grid !important;
  gap: calc(8px * var(--figma-stage-scale)) !important;
}

.play-screen-direct__links .panel-button--primary {
  width: calc(285px * var(--figma-stage-scale)) !important;
  min-height: calc(52px * var(--figma-stage-scale)) !important;
  height: calc(52px * var(--figma-stage-scale)) !important;
}

.play-screen-direct__links .panel-button--primary {
  box-sizing: border-box;
  width: calc(285px * var(--figma-stage-scale)) !important;
  min-height: calc(52px * var(--figma-stage-scale)) !important;
  height: calc(52px * var(--figma-stage-scale)) !important;
  margin-top: 0 !important;
  border-radius: calc(8px * var(--figma-stage-scale)) !important;
  font-size: calc(16px * var(--figma-stage-scale)) !important;
  font-weight: 500 !important;
  line-height: calc(21px * var(--figma-stage-scale)) !important;
  letter-spacing: calc(-0.32px * var(--figma-stage-scale)) !important;
  text-align: center !important;
}

/* 승/패 예측 exact pass — scaled from Figma 243:8740 */
.predict-screen {
  position: relative;
  width: var(--figma-stage-width);
  min-height: var(--device-height);
  overflow: hidden;
  background: #fff;
}

.predict-screen .topbar {
  top: calc(var(--safe-top) + 22px);
  z-index: 4;
}

.predict-screen .screen__body {
  box-sizing: border-box;
  padding: calc(var(--safe-top) + (148px * var(--figma-stage-scale))) 0 0 !important;
}

.predict--figma .hero-copy {
  width: calc(266px * var(--figma-stage-scale)) !important;
  margin: 0 auto !important;
  display: grid;
  justify-items: center;
  gap: calc(8px * var(--figma-stage-scale)) !important;
}

.predict-screen .page-title {
  margin: 0 !important;
  color: #0068b7;
  font-size: calc(24px * var(--figma-stage-scale)) !important;
  font-weight: 700;
  line-height: calc(30px * var(--figma-stage-scale)) !important;
  letter-spacing: calc(-0.96px * var(--figma-stage-scale)) !important;
  text-align: center;
}

.predict-copy {
  margin: 0 !important;
  color: #2a2a2b;
  font-size: calc(16px * var(--figma-stage-scale)) !important;
  font-weight: 300;
  line-height: calc(21px * var(--figma-stage-scale)) !important;
  letter-spacing: calc(-0.32px * var(--figma-stage-scale)) !important;
  text-align: center;
}

.predict-meta {
  width: calc(344px * var(--figma-stage-scale)) !important;
  margin: calc(18px * var(--figma-stage-scale)) auto 0 !important;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: calc(8px * var(--figma-stage-scale)) !important;
}

.predict-meta__note,
.predict-toggle span {
  font-size: calc(12px * var(--figma-stage-scale)) !important;
  font-weight: 300;
  line-height: calc(16px * var(--figma-stage-scale)) !important;
  letter-spacing: calc(-0.24px * var(--figma-stage-scale)) !important;
}

.predict-meta__note {
  margin: 0 !important;
  color: #0068b7;
}

.predict-toggle {
  gap: calc(4px * var(--figma-stage-scale)) !important;
  align-items: center;
}

.predict-toggle input {
  width: calc(24px * var(--figma-stage-scale)) !important;
  height: calc(24px * var(--figma-stage-scale)) !important;
}

.predict-board {
  position: relative;
  width: calc(343px * var(--figma-stage-scale)) !important;
  margin: calc(16px * var(--figma-stage-scale)) auto 0 !important;
  border-radius: 8px 8px 0 0;
  overflow: hidden;
}

.predict-list {
  padding-bottom: calc(209px * var(--figma-stage-scale)) !important;
}

.predict-card {
  padding: calc(16px * var(--figma-stage-scale)) 0 !important;
}

.predict-card__head,
.predict-row,
.predict-locked-card,
.predict-history-row {
  width: var(--figma-cta-width) !important;
}

.predict-card__head {
  min-height: calc(32px * var(--figma-stage-scale)) !important;
}

.predict-card__badge,
.predict-history-row__badge {
  min-width: calc(82px * var(--figma-stage-scale));
  height: calc(29px * var(--figma-stage-scale));
  padding: 0 calc(10px * var(--figma-stage-scale));
  border-radius: 8px;
  font-size: calc(16px * var(--figma-stage-scale));
  line-height: calc(21px * var(--figma-stage-scale));
}

.predict-row {
  min-height: calc(48px * var(--figma-stage-scale));
}

.predict-option {
  padding: 0 calc(18px * var(--figma-stage-scale)) !important;
}

.predict-screen .screen__footer {
  position: absolute !important;
  left: 0;
  right: 0;
  bottom: 0;
  box-sizing: border-box;
  padding: calc(106px * var(--figma-stage-scale)) 0 calc(34px * var(--figma-stage-scale)) !important;
  background: none !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  z-index: 5;
}

.predict-screen .screen__footer::before {
  content: '';
  position: absolute;
  left: 50%;
  bottom: 0;
  width: calc(343px * var(--figma-stage-scale));
  height: calc(209px * var(--figma-stage-scale));
  transform: translateX(-50%);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.82) 34%, #fff 67%);
  pointer-events: none;
}

.predict-screen .screen__footer .cta {
  position: relative;
  z-index: 1;
  width: var(--figma-cta-width) !important;
  min-height: 0 !important;
  height: calc(52px * var(--figma-stage-scale)) !important;
}

.predict-footer-note {
  position: relative;
  z-index: 1;
  margin-top: calc(8px * var(--figma-stage-scale)) !important;
  color: #ff0000;
  font-size: calc(12px * var(--figma-stage-scale)) !important;
  font-weight: 300;
  line-height: calc(16px * var(--figma-stage-scale)) !important;
  letter-spacing: calc(-0.24px * var(--figma-stage-scale)) !important;
  text-align: center;
}

/* 승/패 예측 text/layout correction — keep 375-frame text metrics to preserve line breaks */
.predict-screen .screen__body {
  padding-top: calc(var(--safe-top) + 148px) !important;
}

.predict--figma .hero-copy {
  width: 266px !important;
  gap: 8px !important;
}

.predict-screen .page-title {
  font-size: 24px !important;
  line-height: 30px !important;
  letter-spacing: -0.96px !important;
}

.predict-copy {
  font-size: 16px !important;
  line-height: 21px !important;
  letter-spacing: -0.32px !important;
}

.predict-meta {
  width: 344px !important;
  margin-top: 18px !important;
  gap: 12px !important;
}

.predict-meta__note,
.predict-toggle span {
  font-size: 12px !important;
  line-height: 16px !important;
  letter-spacing: -0.24px !important;
}

.predict-toggle input {
  width: 24px !important;
  height: 24px !important;
}

.predict-board {
  width: 343px !important;
  margin-top: 8px !important;
}

.predict-list {
  padding-bottom: 209px !important;
}

.predict-card__head,
.predict-row,
.predict-locked-card,
.predict-history-row {
  width: 285px !important;
}

.predict-card__badge,
.predict-history-row__badge {
  min-width: 82px;
  height: 29px;
  padding: 0 10px;
  font-size: 16px;
  line-height: 21px;
}

.predict-screen .screen__footer {
  padding: 106px 0 34px !important;
}

.predict-screen .screen__footer::before {
  width: 343px;
  height: 209px;
}

.predict-screen .screen__footer .cta {
  width: 285px !important;
  height: 52px !important;
}

.predict-footer-note {
  margin-top: 8px !important;
  font-size: 12px !important;
  line-height: 16px !important;
  letter-spacing: -0.24px !important;
}

/* 승/패 예측 exact lock — main / picked / blocked */
.predict-screen {
  position: relative;
  overflow: hidden;
  min-height: 812px;
}

.predict-screen .screen__body {
  position: relative !important;
  min-height: 812px !important;
  padding: 0 !important;
}

.predict--figma {
  position: relative;
  min-height: 812px;
  padding: 0 !important;
}

.predict--figma .hero-copy {
  position: absolute !important;
  top: 148px !important;
  left: 54px !important;
  width: 266px !important;
  margin: 0 !important;
  gap: 8px !important;
}

.predict-screen .page-title {
  width: 108px !important;
  margin: 0 auto !important;
  font-size: 24px !important;
  line-height: 30px !important;
  letter-spacing: -0.96px !important;
}

.predict-copy {
  width: 266px !important;
  margin: 0 auto !important;
  font-size: 16px !important;
  line-height: 21px !important;
  letter-spacing: -0.32px !important;
  text-align: center !important;
}

.predict-meta {
  position: absolute !important;
  top: 248px !important;
  left: 15px !important;
  width: 344px !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 0 !important;
}

.predict-meta__note,
.predict-toggle,
.predict-toggle span {
  font-size: 12px !important;
  line-height: 16px !important;
  letter-spacing: -0.24px !important;
}

.predict-toggle {
  width: 156px !important;
  justify-content: space-between !important;
  gap: 0 !important;
}

.predict-toggle span {
  flex: 1 1 auto;
}

.predict-toggle input {
  width: 24px !important;
  height: 24px !important;
}

.predict-board {
  position: absolute !important;
  top: 280px !important;
  left: 16px !important;
  width: 343px !important;
  height: 364px !important;
  margin: 0 !important;
  border-radius: 8px 8px 0 0 !important;
  background: #333 !important;
  overflow: hidden !important;
}

.predict-list {
  height: 364px !important;
  max-height: 364px !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.predict-card {
  padding: 16px 0 !important;
}

.predict-card__head,
.predict-row,
.predict-locked-card,
.predict-history-row {
  width: 285px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.predict-row,
.predict-locked-card {
  margin-top: 12px !important;
}

.predict-history-row {
  min-height: 53px !important;
}

.predict-card__badge,
.predict-history-row__badge {
  min-width: 82px !important;
  height: 29px !important;
  padding: 0 10px !important;
  font-size: 16px !important;
  line-height: 21px !important;
}

.predict-screen .screen__footer {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  bottom: calc(var(--device-height) - 812px) !important;
  box-sizing: border-box;
  padding: 106px 0 34px !important;
  background: none !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  z-index: 5 !important;
}

.predict-screen .screen__footer::before {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 343px;
  height: 209px;
  transform: translateX(-50%);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.82) 34%, #fff 67%);
  pointer-events: none;
}

.predict-screen .screen__footer .cta {
  position: relative;
  z-index: 1;
  width: 285px !important;
  min-height: 52px !important;
  height: 52px !important;
}

.predict-footer-note {
  position: static !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  z-index: 1;
  width: 159px !important;
  margin: 8px auto 0 !important;
  font-size: 12px !important;
  line-height: 16px !important;
  letter-spacing: -0.24px !important;
  text-align: center !important;
}

/* 승/패 예측 viewport lock — keep footer visible in main/completed states */
.predict-screen {
  height: var(--mockup-screen-height) !important;
  min-height: var(--mockup-screen-height) !important;
}

.predict-screen .screen__body {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  height: 100% !important;
  padding-bottom: 0 !important;
  overflow: hidden !important;
}

.predict--figma .hero-copy,
.predict-meta {
  flex: 0 0 auto;
}

.predict-board {
  flex: 1 1 auto;
  min-height: 0;
  align-self: stretch;
}

.predict-list {
  height: 100%;
  min-height: 0;
  overflow: hidden;
}

.predict-screen--main .predict-board,
.predict-screen--picked .predict-board,
.predict-screen--blocked .predict-board {
  margin-top: 8px !important;
}

/* 승/패 예측 구조 고정 — footer visible, board scrolls internally */
.predict-screen {
  height: var(--mockup-screen-height) !important;
  min-height: var(--mockup-screen-height) !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}

.predict-screen .screen__body {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  padding-bottom: 0 !important;
  overflow: hidden !important;
}

.predict--figma .hero-copy,
.predict-meta {
  flex: 0 0 auto;
}

.predict-board {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  height: auto !important;
}

.predict-list {
  height: 100% !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  -ms-overflow-style: none;
  scrollbar-width: none;
  padding-bottom: 236px !important;
}

.predict-list::-webkit-scrollbar {
  display: none;
}

.predict-screen .screen__footer {
  padding: 16px 0 84px !important;
}

.predict-screen .screen__footer::before {
  height: 248px !important;
}

.predict-screen--main .predict-board,
.predict-screen--picked .predict-board,
.predict-screen--blocked .predict-board {
  height: 382px !important;
  max-height: 382px !important;
}

/* 선발 포지션 예측 — final exact override */
.lineup-screen {
  position: relative !important;
  height: var(--mockup-screen-height) !important;
  min-height: var(--mockup-screen-height) !important;
  overflow: hidden !important;
}

.lineup-screen .screen__body {
  position: relative !important;
  width: 375px !important;
  min-height: 812px !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

.lineup--figma {
  position: relative !important;
  width: 375px !important;
  min-height: 812px !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

.lineup-screen .page-title {
  position: absolute !important;
  top: 140px !important;
  left: 50% !important;
  width: auto !important;
  min-width: 180px !important;
  margin: 0 !important;
  white-space: nowrap !important;
  transform: translateX(-50%) !important;
  z-index: 2 !important;
}

.lineup-copy {
  position: absolute !important;
  top: 176px !important;
  left: 27px !important;
  width: 321px !important;
  margin: 0 !important;
  color: #2a2a2b !important;
  font-size: 16px !important;
  font-weight: 300 !important;
  line-height: 21px !important;
  letter-spacing: -0.32px !important;
  text-align: center !important;
  z-index: 2 !important;
}

.lineup-field {
  position: absolute !important;
  top: 232px !important;
  left: 16px !important;
  width: 343px !important;
  height: 343px !important;
  margin: 0 !important;
  overflow: visible !important;
  z-index: 1 !important;
}

.lineup-field__image {
  position: absolute !important;
  top: 31px !important;
  left: 0 !important;
  display: block !important;
  width: 343px !important;
  height: 306px !important;
  object-fit: fill !important;
  z-index: 0 !important;
}

.lineup-slot {
  position: absolute !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  width: 54px !important;
  height: 86px !important;
  padding-top: 18px !important;
  border: 0 !important;
  background:
    url("../mcp/exact/lineup/lineup-slot-shadow.svg?v=20260415-1") center / 54px 86px no-repeat,
    url("../mcp/exact/lineup/lineup-slot-inner.svg?v=20260415-1") center / 48.7054px 78.7658px no-repeat,
    url("../mcp/exact/lineup/lineup-slot-shell.svg?v=20260415-1") center / 54px 86px no-repeat !important;
  clip-path: none !important;
  box-shadow: none !important;
  z-index: 1 !important;
}

.lineup-slot span {
  transform: none !important;
  color: #0068b7 !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  line-height: 30px !important;
  letter-spacing: -0.96px !important;
  text-align: center !important;
}

.lineup-slot--cf { top: 0 !important; left: 50% !important; transform: translateX(-50%) !important; }
.lineup-slot--lf { top: 47px !important; left: 20px !important; }
.lineup-slot--rf { top: 47px !important; right: 18px !important; }
.lineup-slot--ss { top: 82px !important; left: 83px !important; }
.lineup-slot--2b { top: 82px !important; right: 82px !important; }
.lineup-slot--p { top: 146px !important; left: 50% !important; transform: translateX(-50%) !important; }
.lineup-slot--3b { top: 170px !important; left: 44px !important; }
.lineup-slot--1b { top: 170px !important; right: 45px !important; }
.lineup-slot--dh { top: 257px !important; left: 27px !important; }
.lineup-slot--c { top: 257px !important; left: 50% !important; transform: translateX(-50%) !important; }

.lineup-slot.is-assigned,
.lineup-slot.is-current {
  padding-top: 0 !important;
  background: none !important;
  box-shadow: none !important;
}

.lineup-slot__card-image {
  display: block !important;
  width: 54px !important;
  height: 86px !important;
  border-radius: 4px !important;
  object-fit: cover !important;
}

.lineup-badge {
  position: absolute !important;
  top: 263px !important;
  left: 263px !important;
  right: auto !important;
  bottom: auto !important;
  width: 80px !important;
  height: 80px !important;
  z-index: 2 !important;
}

.lineup-badge__logo {
  display: block !important;
  width: 80px !important;
  height: 80px !important;
  object-fit: contain !important;
}

.lineup-card-strip {
  position: absolute !important;
  top: 603px !important;
  left: 16px !important;
  display: flex !important;
  gap: 8px !important;
  width: 343px !important;
  height: 86px !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: none !important;
}

.lineup-card-strip::-webkit-scrollbar {
  display: none !important;
}

.lineup-card-option {
  flex: 0 0 54px !important;
  width: 54px !important;
  min-width: 54px !important;
  opacity: 1 !important;
}

.lineup-card-option img {
  display: block !important;
  width: 54px !important;
  height: 86px !important;
  border-radius: 4px !important;
  object-fit: cover !important;
  box-shadow: none !important;
}

.lineup-card-option.is-selected img,
.lineup-card-option.is-assigned img {
  box-shadow: none !important;
}

.screen__footer--lineup {
  position: absolute !important;
  top: 730px !important;
  left: 0 !important;
  right: auto !important;
  bottom: auto !important;
  width: 375px !important;
  padding: 0 !important;
  transform: none !important;
  z-index: 3 !important;
}

.screen__footer--lineup .cta {
  width: 375px !important;
  height: 82px !important;
  min-height: 82px !important;
}

.lineup-screen--success .modal-backdrop {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  padding-top: 279px !important;
}

.modal-card--lineup,
.modal-card--lineup-success {
  width: 285px !important;
  border-radius: 8px !important;
  overflow: hidden !important;
}

.modal-card--lineup .modal-card__body {
  padding: 36px 24px 20px !important;
  gap: 10px !important;
  background: #fff !important;
}

.modal-card--lineup .modal-card__title,
.modal-card--lineup-success .modal-card__title {
  color: #2a2a2b !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 21px !important;
  letter-spacing: -0.32px !important;
  text-align: center !important;
}

.modal-card--lineup .modal-card__caption--danger {
  margin: 0 !important;
  color: #ff0000 !important;
  font-size: 14px !important;
  font-weight: 300 !important;
  line-height: 20px !important;
  letter-spacing: -0.56px !important;
  text-align: center !important;
}

.modal-card--lineup-success {
  background: #fff !important;
}

.modal-card--lineup-success .modal-card__body {
  padding: 36px 24px 20px !important;
  gap: 12px !important;
  background: #fff !important;
}

.modal-card--lineup-success .modal-card__caption--neutral {
  margin: 0 !important;
  color: #8c8c8c !important;
  font-size: 14px !important;
  font-weight: 300 !important;
  line-height: 20px !important;
  letter-spacing: -0.56px !important;
  text-align: center !important;
}

.modal-card--lineup-success .modal-card__footer--single {
  min-height: 52px !important;
  background: var(--brand) !important;
}

.modal-card--lineup-success .modal-card__single {
  width: 100% !important;
  height: 52px !important;
  min-height: 52px !important;
  border-radius: 0 !important;
}

/* 경험 공유 — final exact override */
.community-screen .topbar {
  top: calc(var(--safe-top) + 34px) !important;
}

.community-screen__body {
  position: relative !important;
  width: 375px !important;
  min-height: 812px !important;
  padding: 0 !important;
}

.community-screen .page-title {
  top: 111px !important;
  left: 36px !important;
  width: 302px !important;
}

.community-screen__lead {
  top: 151px !important;
  left: 84px !important;
  width: 206px !important;
}

.community-screen--detail .community-screen__lead {
  left: 80px !important;
  width: 215px !important;
}

.community-grid--figma {
  top: 197px !important;
  left: 16px !important;
  width: 343px !important;
  gap: 6px !important;
}

.community-tile--figma {
  width: 168px !important;
  height: 206px !important;
  padding: 8px !important;
}

.community-tile--figma .community-tile__photo {
  width: 152px !important;
  height: 96px !important;
  margin: 0 !important;
}

.community-tile--figma .community-tile__meta {
  margin-top: 8px !important;
}

.community-tile--figma strong {
  margin-top: 6px !important;
}

.community-card__photo-icon {
  display: block !important;
  width: 32px !important;
  height: 32px !important;
  border: 0 !important;
  border-radius: 0 !important;
  position: static !important;
}

.community-card__photo-icon::before,
.community-card__photo-icon::after {
  content: none !important;
  display: none !important;
}

.community-placeholder,
.community-tile__photo > .community-placeholder,
.community-card__photo > .community-placeholder {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
}

.community-placeholder__asset,
.community-tile__photo > .community-placeholder > .community-placeholder__asset,
.community-card__photo > .community-placeholder > .community-placeholder__asset {
  display: block !important;
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  min-height: 32px !important;
  object-fit: contain !important;
}

.community-tile__like,
.community-card__close {
  flex: 0 0 auto !important;
  overflow: hidden !important;
}

.community-card__close {
  width: 24px !important;
  height: 24px !important;
}

.community-tile__heart,
.community-card__heart,
.community-card__close img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
}

.community-tile__heart img,
.community-card__heart img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}

.community-card--detail {
  top: 197px !important;
  left: 12px !important;
  width: 350px !important;
  min-height: 394px !important;
  padding: 16px 8px 12px !important;
}

.community-card__head,
.community-card__footer {
  width: 334px !important;
}

.community-card__photo {
  width: 334px !important;
  height: 243px !important;
  margin: 16px auto 0 !important;
}

.community-card__footer {
  margin-top: 16px !important;
  align-items: flex-end !important;
  gap: 8px !important;
}

.community-card__footer p {
  max-width: 270px !important;
}

.community-card__like {
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 4px !important;
  min-width: 72px !important;
}

.community-card__like span {
  white-space: nowrap !important;
}

.community-card__heart {
  width: 24px !important;
  height: 24px !important;
}

.community-screen .screen__footer--community {
  left: 45px !important;
  width: 285px !important;
  bottom: 128px !important;
}

.community-screen__notice {
  bottom: 69px !important;
  left: 98px !important;
  width: 179px !important;
}

.community-success-toast {
  top: 579px !important;
}

/* 경험 공유 작성/오버레이 — final exact override */
.community-me__back {
  top: 26px !important;
}

.community-me .page-title {
  top: 100px !important;
  left: 58px !important;
  width: 259px !important;
}

.community-me__field--title {
  top: 155px !important;
}

.community-me__editor {
  top: 238px !important;
  height: 280px !important;
}

.community-me__textarea {
  min-height: 260px !important;
}

.community-me__upload {
  top: 518px !important;
}

.community-action-sheet {
  bottom: 32px !important;
}

.community-success-toast {
  left: 50% !important;
  top: 579px !important;
  min-width: 229px !important;
  transform: translateX(-50%) !important;
}

/* 경험 공유 — exact lock */
.community-screen .topbar {
  top: calc(var(--safe-top) + 34px) !important;
  left: 16px !important;
  width: 344px !important;
}

.community-screen__body {
  position: relative !important;
  width: 375px !important;
  min-height: 812px !important;
  padding: 0 !important;
}

.community-screen .page-title {
  position: absolute !important;
  top: 112px !important;
  left: 36px !important;
  width: 302px !important;
  margin: 0 !important;
  color: #0068b7 !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  line-height: 30px !important;
  letter-spacing: -0.96px !important;
  text-align: center !important;
}

.community-screen__lead {
  position: absolute !important;
  top: 150px !important;
  left: 84px !important;
  width: 206px !important;
  margin: 0 !important;
  color: #2a2a2b !important;
  font-size: 16px !important;
  font-weight: 300 !important;
  line-height: 21px !important;
  letter-spacing: -0.32px !important;
  text-align: center !important;
}

.community-screen--detail .community-screen__lead {
  left: 80px !important;
  width: 215px !important;
}

.community-grid--figma {
  position: absolute !important;
  top: 204px !important;
  left: 16px !important;
  width: 343px !important;
  margin: 0 !important;
  gap: 6px !important;
}

.community-tile--figma {
  width: 168px !important;
  height: 206px !important;
  padding: 8px !important;
  border: 1.5px solid #0068b7 !important;
  border-radius: 8px !important;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.25) !important;
  gap: 4px !important;
}

.community-tile--figma .community-tile__photo {
  width: 152px !important;
  height: 96px !important;
  margin: 0 !important;
  border-radius: 8px !important;
  background: rgba(0, 104, 183, 0.4) !important;
}

.community-tile__meta {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  margin-top: 8px !important;
}

.community-tile__meta span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 4px 8px !important;
  border-radius: 8px !important;
  background: #e3e3e3 !important;
  color: #8c8c8c !important;
  font-size: 12px !important;
  font-weight: 300 !important;
  line-height: 16px !important;
  letter-spacing: -0.24px !important;
}

.community-tile__like,
.community-tile__heart {
  width: 20px !important;
  height: 20px !important;
}

.community-tile--figma strong {
  display: block !important;
  width: 100% !important;
  margin-top: 0 !important;
  color: #2a2a2b !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 21px !important;
  letter-spacing: -0.32px !important;
}

.community-tile__button {
  width: 100% !important;
  min-height: 37px !important;
  margin-top: 0 !important;
  border-radius: 8px !important;
  background: #0068b7 !important;
  color: #fff !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 21px !important;
  letter-spacing: -0.32px !important;
}

.community-card__photo-icon,
.community-placeholder__asset {
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  min-height: 32px !important;
}

.community-card--detail {
  position: absolute !important;
  top: 204px !important;
  left: 12px !important;
  width: 351px !important;
  min-height: 415px !important;
  padding: 20px 8px !important;
  border: 2px solid #0068b7 !important;
  border-radius: 8px !important;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.25) !important;
  gap: 22px !important;
}

.community-card__head {
  width: 334px !important;
  margin: 0 auto !important;
  align-items: flex-start !important;
}

.community-card__title-row {
  gap: 8px !important;
}

.community-card__title-row strong {
  color: #2a2a2b !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 21px !important;
  letter-spacing: -0.32px !important;
}

.community-card__title-row span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 4px 8px !important;
  border-radius: 8px !important;
  background: #e3e3e3 !important;
  color: #8c8c8c !important;
  font-size: 12px !important;
  font-weight: 300 !important;
  line-height: 16px !important;
  letter-spacing: -0.24px !important;
}

.community-card__close {
  width: 24px !important;
  height: 24px !important;
}

.community-card__photo {
  width: 334px !important;
  height: 267px !important;
  margin: 0 auto !important;
  border-radius: 8px !important;
  background: rgba(0, 104, 183, 0.4) !important;
}

.community-card__footer {
  width: 334px !important;
  margin: 0 auto !important;
  align-items: flex-end !important;
  gap: 0 !important;
}

.community-card__footer p {
  max-width: 262px !important;
  color: #2a2a2b !important;
  font-size: 14px !important;
  font-weight: 300 !important;
  line-height: 20px !important;
  letter-spacing: -0.56px !important;
}

.community-card__like {
  min-width: 72px !important;
  gap: 0 !important;
  align-items: center !important;
  justify-content: flex-end !important;
}

.community-card__like span {
  color: #2a2a2b !important;
  font-size: 14px !important;
  font-weight: 300 !important;
  line-height: 20px !important;
  letter-spacing: -0.56px !important;
}

.community-card__heart {
  width: 32px !important;
  height: 32px !important;
}

.community-screen .screen__footer--community {
  left: 45px !important;
  width: 285px !important;
  bottom: 90px !important;
}

.community-screen .screen__footer--community .cta {
  width: 285px !important;
  height: 52px !important;
}

.community-screen__notice {
  position: absolute !important;
  left: 98px !important;
  width: 179px !important;
  bottom: 46px !important;
  color: #ff0000 !important;
  font-size: 12px !important;
  font-weight: 300 !important;
  line-height: 16px !important;
  letter-spacing: -0.24px !important;
  text-align: center !important;
}

.community-me {
  min-height: 812px !important;
}

.community-me__back {
  top: calc(var(--safe-top) + 34px) !important;
  left: 16px !important;
}

.community-me__back img {
  width: 20px !important;
  height: 12px !important;
  object-fit: contain !important;
}

.community-me__body {
  position: relative !important;
  width: 375px !important;
  min-height: 812px !important;
  padding: 0 !important;
}

.community-me .page-title {
  position: absolute !important;
  top: 112px !important;
  left: 58px !important;
  width: 259px !important;
  margin: 0 !important;
  color: #0068b7 !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  line-height: 30px !important;
  letter-spacing: -0.96px !important;
  text-align: center !important;
}

.community-me__field--title,
.community-me__editor,
.community-me__upload {
  left: 16px !important;
  width: 343px !important;
}

.community-me__field--title {
  position: absolute !important;
  top: 167px !important;
}

.community-me__field strong {
  padding: 0 4px !important;
  color: #2a2a2b !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 21px !important;
  letter-spacing: -0.32px !important;
}

.community-me__title-input {
  padding: 8px 4px !important;
  border-bottom: 1px solid #8c8c8c !important;
  color: #2a2a2b !important;
  font-size: 16px !important;
  font-weight: 300 !important;
  line-height: 21px !important;
  letter-spacing: -0.32px !important;
}

.community-me__title-input::placeholder,
.community-me__textarea::placeholder {
  color: #8c8c8c !important;
}

.community-me__editor {
  position: absolute !important;
  top: 250px !important;
}

.community-me__textarea {
  min-height: 260px !important;
  padding: 8px !important;
  border-radius: 8px !important;
  background: #f0f0f0 !important;
  color: #2a2a2b !important;
  font-size: 16px !important;
  font-weight: 300 !important;
  line-height: 21px !important;
  letter-spacing: -0.32px !important;
}

.community-me__editor p {
  padding: 0 4px !important;
  color: #8c8c8c !important;
  font-size: 12px !important;
  font-weight: 300 !important;
  line-height: 16px !important;
  letter-spacing: -0.24px !important;
}

.community-me__upload {
  position: absolute !important;
  top: 530px !important;
  width: 80px !important;
  height: 80px !important;
  border: 2px solid #b7b7b7 !important;
  border-radius: 8px !important;
  background: #fff !important;
}

.community-me__upload-icon img,
.community-me__upload-action img {
  width: 24px !important;
  height: 24px !important;
}

.community-me__upload-action {
  top: -6px !important;
  right: -6px !important;
  width: 24px !important;
  height: 24px !important;
}

.community-me .screen__footer {
  left: 45px !important;
  width: 285px !important;
  bottom: 90px !important;
}

.community-me .screen__footer .cta {
  width: 285px !important;
  height: 52px !important;
}

.community-me__notice {
  width: 252px !important;
  bottom: 62px !important;
  color: #ff0000 !important;
  font-size: 12px !important;
  font-weight: 300 !important;
  line-height: 16px !important;
  letter-spacing: -0.24px !important;
  text-align: center !important;
}

.community-action-sheet {
  left: 8px !important;
  width: 359px !important;
  bottom: 32px !important;
  gap: 12px !important;
}

.community-action-sheet__group {
  width: 359px !important;
  border-radius: 13px !important;
  overflow: hidden !important;
  backdrop-filter: blur(11px) !important;
}

.community-action-sheet__group button,
.community-action-sheet__cancel {
  min-height: 60px !important;
  font-family: "Apple SD Gothic Neo", sans-serif !important;
  font-size: 20px !important;
  line-height: 24px !important;
  letter-spacing: 0.38px !important;
}

.community-action-sheet__group button {
  font-weight: 600 !important;
}

.community-action-sheet__cancel {
  width: 359px !important;
  border-radius: 13px !important;
  font-weight: 700 !important;
}

.community-confirm-modal {
  width: 285px !important;
  padding: 36px 0 !important;
  gap: 20px !important;
}

.community-confirm-modal__copy {
  gap: 12px !important;
}

.community-confirm-modal__title {
  color: #2a2a2b !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 21px !important;
  letter-spacing: -0.32px !important;
}

.community-confirm-modal__caption {
  color: #ff0000 !important;
  font-size: 14px !important;
  font-weight: 300 !important;
  line-height: 20px !important;
  letter-spacing: -0.56px !important;
}

.community-confirm-modal__actions {
  gap: 16px !important;
}

.community-confirm-modal__button {
  width: 109px !important;
  height: 52px !important;
  min-height: 52px !important;
}

.community-success-toast {
  left: 73px !important;
  top: 625px !important;
  min-width: 229px !important;
  padding: 8px 20px !important;
  border-radius: 8px !important;
  background: rgba(0, 0, 0, 0.4) !important;
  backdrop-filter: blur(2px) !important;
  color: #f7f7f7 !important;
  font-size: 16px !important;
  font-weight: 300 !important;
  line-height: 21px !important;
  letter-spacing: -0.32px !important;
  text-align: center !important;
  transform: none !important;
}

/* 경험 공유 — final exact override v2 */
.community-screen,
.community-me {
  position: relative !important;
  height: 812px !important;
  min-height: 812px !important;
  overflow: hidden !important;
}

.community-screen__body,
.community-me__body {
  position: relative !important;
  width: 375px !important;
  height: 812px !important;
  min-height: 812px !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

.community-screen .page-title {
  position: absolute !important;
  top: 104px !important;
  left: 36px !important;
  width: 302px !important;
  margin: 0 !important;
}

.community-screen__lead {
  position: absolute !important;
  top: 144px !important;
  left: 84px !important;
  width: 206px !important;
  margin: 0 !important;
}

.community-screen--detail .community-screen__lead {
  left: 80px !important;
  width: 215px !important;
}

.community-grid--figma {
  position: absolute !important;
  top: 197px !important;
  left: 16px !important;
  width: 343px !important;
  margin: 0 !important;
  gap: 6px !important;
}

.community-tile--figma {
  position: relative !important;
  width: 168px !important;
  height: 206px !important;
  min-height: 206px !important;
  padding: 8px !important;
  gap: 4px !important;
}

.community-tile--figma .community-tile__photo {
  width: 152px !important;
  height: 96px !important;
  margin: 0 !important;
}

.community-tile--figma .community-tile__meta {
  margin-top: 8px !important;
  align-items: center !important;
}

.community-tile__meta span {
  min-width: 72px !important;
  height: 24px !important;
}

.community-tile__like,
.community-card__close {
  width: 24px !important;
  height: 24px !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
}

.community-tile__heart,
.community-card__heart,
.community-card__close img {
  display: block !important;
  width: 24px !important;
  height: 24px !important;
}

.community-tile--figma strong {
  margin-top: 6px !important;
  min-height: 42px !important;
}

.community-tile__button {
  width: 152px !important;
  min-height: 38px !important;
  height: 38px !important;
  margin-top: auto !important;
  border-radius: 8px !important;
}

.community-card--detail {
  position: absolute !important;
  top: 197px !important;
  left: 12px !important;
  width: 351px !important;
  min-height: 416px !important;
  padding: 20px 8px 12px !important;
  gap: 22px !important;
}

.community-card__head,
.community-card__footer {
  width: 334px !important;
  margin: 0 auto !important;
}

.community-card__photo {
  width: 334px !important;
  height: 267px !important;
  margin: 0 auto !important;
}

.community-card__footer {
  margin-top: 0 !important;
  align-items: flex-end !important;
  gap: 8px !important;
}

.community-card__footer p {
  max-width: 254px !important;
  margin: 0 !important;
}

.community-card__like {
  min-width: 72px !important;
  width: auto !important;
  justify-content: flex-end !important;
  align-items: flex-end !important;
  gap: 4px !important;
  padding: 0 !important;
}

.community-card__like span {
  white-space: nowrap !important;
}

.community-screen .screen__footer--community {
  position: absolute !important;
  left: 45px !important;
  right: auto !important;
  width: 285px !important;
  bottom: 90px !important;
  padding: 0 !important;
  z-index: 2 !important;
}

.community-screen .screen__footer--community .cta {
  width: 285px !important;
  height: 52px !important;
  min-height: 52px !important;
}

.community-screen__notice {
  position: absolute !important;
  left: 98px !important;
  width: 179px !important;
  bottom: 28px !important;
  margin: 0 !important;
  z-index: 2 !important;
}

.community-me__back {
  position: absolute !important;
  top: 26px !important;
  left: 16px !important;
  width: 24px !important;
  height: 24px !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
  z-index: 2 !important;
}

.community-me__back img {
  display: block !important;
  width: 24px !important;
  height: 24px !important;
}

.community-me .page-title {
  position: absolute !important;
  top: 103px !important;
  left: 58px !important;
  width: 259px !important;
  margin: 0 !important;
}

.community-me__field--title {
  position: absolute !important;
  top: 158px !important;
  left: 16px !important;
  width: 343px !important;
  margin: 0 !important;
}

.community-me__field strong {
  display: block !important;
  margin-bottom: 8px !important;
}

.community-me__editor {
  position: absolute !important;
  top: 242px !important;
  left: 16px !important;
  width: 343px !important;
  height: 258px !important;
  margin: 0 !important;
}

.community-me__textarea {
  min-height: 232px !important;
  padding: 16px 18px 28px !important;
}

.community-me__upload {
  position: absolute !important;
  top: 520px !important;
  left: 16px !important;
  width: 80px !important;
  height: 80px !important;
  margin: 0 !important;
}

.community-me__upload-preview,
.community-me__upload-preview--sample {
  width: 80px !important;
  height: 80px !important;
}

.community-me__upload-icon img,
.community-me__upload-action img {
  width: 24px !important;
  height: 24px !important;
}

.community-me__upload-action {
  top: -8px !important;
  right: -8px !important;
  width: 24px !important;
  height: 24px !important;
}

.community-me .screen__footer {
  position: absolute !important;
  left: 45px !important;
  right: auto !important;
  width: 285px !important;
  bottom: 34px !important;
  padding: 0 !important;
  margin: 0 !important;
  z-index: 2 !important;
}

.community-me .screen__footer .cta {
  width: 285px !important;
  height: 52px !important;
  min-height: 52px !important;
}

.community-sheet-backdrop,
.modal-backdrop--community {
  position: fixed !important;
  inset: 0 !important;
  z-index: 28 !important;
}

.community-action-sheet {
  position: fixed !important;
  left: 50% !important;
  right: auto !important;
  bottom: 32px !important;
  width: 359px !important;
  transform: translateX(-50%) !important;
  margin: 0 !important;
  z-index: 30 !important;
}

.community-confirm-modal {
  position: fixed !important;
  top: 308px !important;
  left: 50% !important;
  width: 285px !important;
  transform: translateX(-50%) !important;
  z-index: 31 !important;
}

.community-success-toast {
  position: fixed !important;
  left: 73px !important;
  top: 581px !important;
  width: 229px !important;
  min-width: 229px !important;
  height: 37px !important;
  min-height: 37px !important;
  padding: 8px 20px !important;
  transform: none !important;
  white-space: nowrap !important;
  z-index: 32 !important;
}

/* 승/패 예측 완료 — exact lock */
.predict-screen--blocked .hero-copy {
  top: 148px !important;
  left: 54px !important;
  width: 266px !important;
}

.predict-screen--blocked .page-title {
  width: 108px !important;
}

.predict-screen--blocked .predict-copy {
  width: 266px !important;
}

.predict-screen--blocked .predict-meta {
  top: 248px !important;
  left: 15px !important;
  width: 344px !important;
}

.predict-screen--blocked .predict-board {
  position: absolute !important;
  top: 280px !important;
  left: 16px !important;
  width: 343px !important;
  height: 532px !important;
  max-height: 532px !important;
  margin: 0 !important;
  background: #333 !important;
  border-radius: 8px 8px 0 0 !important;
  overflow: hidden !important;
}

.predict-screen--blocked .predict-list {
  height: 532px !important;
  max-height: 532px !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.predict-screen--blocked .predict-card {
  padding: 16px 0 0 !important;
}

.predict-screen--blocked .predict-card__head,
.predict-screen--blocked .predict-row,
.predict-screen--blocked .predict-locked-card,
.predict-screen--blocked .predict-history-row {
  width: 285px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.predict-screen--blocked .predict-history-row {
  min-height: 53px !important;
}

.predict-screen--blocked .predict-card__badge,
.predict-screen--blocked .predict-history-row__badge {
  min-width: 82px !important;
  height: 29px !important;
  padding: 0 10px !important;
  font-size: 16px !important;
  line-height: 21px !important;
}

.predict-screen--blocked .predict-card.is-complete .predict-card__badge {
  background: #1ac5ff !important;
}

.predict-screen--blocked .screen__footer {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  background: none !important;
  z-index: 5 !important;
}

.predict-screen--blocked .screen__footer::before {
  content: "" !important;
  position: absolute !important;
  left: 16px !important;
  top: 603px !important;
  width: 343px !important;
  height: 209px !important;
  transform: none !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.24) 22%, rgba(255, 255, 255, 0.78) 58%, #fff 84%) !important;
  pointer-events: none !important;
}

.predict-screen--blocked .screen__footer .cta {
  position: absolute !important;
  top: 670px !important;
  left: 45px !important;
  width: 285px !important;
  height: 52px !important;
  min-height: 52px !important;
  margin: 0 !important;
  z-index: 1 !important;
}

.predict-screen--blocked .predict-footer-note {
  position: absolute !important;
  top: 64px !important;
  left: 63px !important;
  width: 159px !important;
  margin: 0 !important;
  text-align: center !important;
  z-index: 1 !important;
}

/* 승/패 예측 — blocked exact lock */
.predict-screen--blocked {
  position: relative !important;
  display: block !important;
  width: 375px !important;
  height: 812px !important;
  min-height: 812px !important;
  overflow: hidden !important;
}

.predict-screen--blocked .screen__body {
  position: relative !important;
  display: block !important;
  width: 375px !important;
  height: 812px !important;
  min-height: 812px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.predict-screen--blocked .predict--figma {
  position: relative !important;
  width: 375px !important;
  height: 812px !important;
  min-height: 812px !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

.predict-screen--blocked .predict--figma .hero-copy {
  position: absolute !important;
  top: 148px !important;
  left: 54px !important;
  width: 266px !important;
  margin: 0 !important;
  gap: 8px !important;
}

.predict-screen--blocked .predict-meta {
  position: absolute !important;
  top: 248px !important;
  left: 15px !important;
  width: 344px !important;
  margin: 0 !important;
}

.predict-screen--blocked .predict-board {
  position: absolute !important;
  top: 280px !important;
  left: 16px !important;
  width: 343px !important;
  height: 532px !important;
  max-height: 532px !important;
  margin: 0 !important;
  border-radius: 8px 8px 0 0 !important;
  overflow: hidden !important;
}

.predict-screen--blocked .predict-list {
  height: 532px !important;
  max-height: 532px !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.predict-screen--blocked .predict-history-row {
  min-height: 53px !important;
}

.predict-screen--blocked .screen__footer {
  position: absolute !important;
  top: 670px !important;
  left: 45px !important;
  right: auto !important;
  width: 285px !important;
  padding: 0 !important;
  margin: 0 !important;
  background: none !important;
  display: block !important;
  z-index: 7 !important;
}

.predict-screen--blocked .screen__footer::before {
  content: "" !important;
  position: absolute !important;
  top: -67px !important;
  left: -29px !important;
  width: 343px !important;
  height: 209px !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.82) 34%, #fff 67%) !important;
  pointer-events: none !important;
}

.predict-screen--blocked .screen__footer .cta {
  position: relative !important;
  z-index: 1 !important;
  width: 285px !important;
  height: 52px !important;
  min-height: 52px !important;
}

.predict-screen--blocked .predict-footer-note {
  position: absolute !important;
  top: 64px !important;
  left: 63px !important;
  width: 159px !important;
  margin: 0 !important;
  z-index: 1 !important;
}

/* 승/패 예측 — blocked exact final */
.predict-screen--blocked .predict-list {
  height: 532px !important;
  max-height: 532px !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.predict-screen--blocked .predict-history-row {
  width: 285px !important;
  min-height: 53px !important;
  padding: 0 !important;
  margin: 0 auto !important;
}

.predict-screen--blocked .predict-history-row__badge {
  min-width: 80px !important;
  height: 32px !important;
  padding: 0 10px !important;
}

.predict-screen--blocked .predict-history-row__badge--success {
  background: #2f70ff !important;
}

.predict-screen--blocked .predict-history-row__badge--failure {
  background: #ff3b30 !important;
}

.predict-screen--blocked .predict-history-row__chevron::before {
  transform: rotate(45deg) !important;
}

.predict-screen--blocked .predict-card.is-complete .predict-card__badge {
  background: #00b4ed !important;
}

.predict-screen--blocked .screen__footer {
  position: absolute !important;
  top: 670px !important;
  left: 45px !important;
  right: auto !important;
  bottom: auto !important;
  width: 285px !important;
  height: 52px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  background: none !important;
  overflow: visible !important;
  z-index: 7 !important;
}

.predict-screen--blocked .screen__footer::before {
  content: "" !important;
  position: absolute !important;
  top: -67px !important;
  left: -29px !important;
  width: 343px !important;
  height: 209px !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.82) 34%, #fff 67%) !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

.predict-screen--blocked .screen__footer .cta {
  position: relative !important;
  z-index: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 285px !important;
  height: 52px !important;
  min-height: 52px !important;
  margin: 0 !important;
}

.predict-screen--blocked .predict-footer-note {
  position: absolute !important;
  top: 64px !important;
  left: 63px !important;
  width: 159px !important;
  margin: 0 !important;
  text-align: center !important;
  z-index: 7 !important;
}

/* Predict main/picked final alignment */
.predict-screen.predict-screen--main .hero-copy,
.predict-screen.predict-screen--picked .hero-copy {
  top: calc(138px * var(--figma-stage-scale)) !important;
}

.predict-screen.predict-screen--main .predict-meta,
.predict-screen.predict-screen--picked .predict-meta {
  top: calc(238px * var(--figma-stage-scale)) !important;
  width: calc(343px * var(--figma-stage-scale)) !important;
  margin-top: calc(16px * var(--figma-stage-scale)) !important;
}

.predict-screen.predict-screen--main .predict-meta__note,
.predict-screen.predict-screen--picked .predict-meta__note {
  width: calc(112px * var(--figma-stage-scale)) !important;
  flex: 0 0 calc(112px * var(--figma-stage-scale)) !important;
}

.predict-screen.predict-screen--main .predict-toggle,
.predict-screen.predict-screen--picked .predict-toggle {
  width: auto !important;
  min-width: 0 !important;
  flex: 1 1 auto !important;
  justify-content: flex-end !important;
}

.predict-screen.predict-screen--main .predict-toggle span,
.predict-screen.predict-screen--picked .predict-toggle span {
  white-space: nowrap !important;
}

.predict-screen.predict-screen--main .predict-board,
.predict-screen.predict-screen--picked .predict-board {
  top: calc(266px * var(--figma-stage-scale)) !important;
  width: calc(343px * var(--figma-stage-scale)) !important;
  margin-top: calc(14px * var(--figma-stage-scale)) !important;
}

.predict-screen.predict-screen--main .predict-card,
.predict-screen.predict-screen--picked .predict-card {
  padding: calc(10px * var(--figma-stage-scale)) 0 !important;
}

.predict-screen.predict-screen--main .predict-list,
.predict-screen.predict-screen--picked .predict-list {
  padding-bottom: calc(170px * var(--figma-stage-scale)) !important;
}

.predict-screen.predict-screen--main .screen__footer,
.predict-screen.predict-screen--picked .screen__footer {
  padding-top: calc(72px * var(--figma-stage-scale)) !important;
}

.predict-screen.predict-screen--main .screen__footer::before,
.predict-screen.predict-screen--picked .screen__footer::before {
  top: calc(-42px * var(--figma-stage-scale)) !important;
  height: calc(170px * var(--figma-stage-scale)) !important;
}

.predict-screen.predict-screen--main .predict-card__head,
.predict-screen.predict-screen--picked .predict-card__head {
  min-height: calc(28px * var(--figma-stage-scale)) !important;
}

.predict-screen.predict-screen--main .predict-card__head > span,
.predict-screen.predict-screen--picked .predict-card__head > span {
  font-size: calc(14px * var(--figma-stage-scale)) !important;
  line-height: calc(18px * var(--figma-stage-scale)) !important;
  letter-spacing: calc(-0.28px * var(--figma-stage-scale)) !important;
}

.predict-screen.predict-screen--main .predict-card__badge,
.predict-screen.predict-screen--picked .predict-card__badge {
  min-width: calc(74px * var(--figma-stage-scale)) !important;
  height: calc(25px * var(--figma-stage-scale)) !important;
  padding: 0 calc(8px * var(--figma-stage-scale)) !important;
  font-size: calc(14px * var(--figma-stage-scale)) !important;
  line-height: calc(18px * var(--figma-stage-scale)) !important;
}

.predict-screen.predict-screen--main .predict-row,
.predict-screen.predict-screen--picked .predict-row {
  min-height: calc(44px * var(--figma-stage-scale)) !important;
  margin-top: calc(10px * var(--figma-stage-scale)) !important;
}

.predict-screen.predict-screen--main .predict-option,
.predict-screen.predict-screen--picked .predict-option {
  min-height: calc(44px * var(--figma-stage-scale)) !important;
  padding: 0 calc(14px * var(--figma-stage-scale)) !important;
}

.predict-screen.predict-screen--main .predict-option__team img,
.predict-screen.predict-screen--picked .predict-option__team img {
  width: calc(40px * var(--figma-stage-scale)) !important;
  height: calc(40px * var(--figma-stage-scale)) !important;
}

.predict-screen.predict-screen--main .predict-option__label,
.predict-screen.predict-screen--picked .predict-option__label {
  font-size: calc(16px * var(--figma-stage-scale)) !important;
  line-height: calc(21px * var(--figma-stage-scale)) !important;
  letter-spacing: calc(-0.32px * var(--figma-stage-scale)) !important;
}

/* 예측 완료 — true EOF hard lock */
.screen.predict-screen.predict-screen--blocked {
  position: relative !important;
  width: var(--figma-stage-width) !important;
  min-width: var(--figma-stage-width) !important;
  max-width: var(--figma-stage-width) !important;
  min-height: var(--device-height) !important;
  height: var(--device-height) !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.screen.predict-screen.predict-screen--blocked .topbar {
  position: absolute !important;
  top: calc(var(--safe-top) + (70px * var(--figma-stage-scale))) !important;
  left: 50% !important;
  width: calc(344px * var(--figma-stage-scale)) !important;
  height: calc(30px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: translateX(-50%) !important;
  z-index: 6 !important;
}

.screen.predict-screen.predict-screen--blocked .screen__body {
  position: relative !important;
  width: var(--figma-stage-width) !important;
  min-height: var(--device-height) !important;
  margin: 0 !important;
  padding: 0 !important;
}

.screen.predict-screen.predict-screen--blocked .predict--figma {
  position: relative !important;
  width: var(--figma-stage-width) !important;
  min-height: var(--device-height) !important;
  margin: 0 !important;
  padding: 0 !important;
}

.screen.predict-screen.predict-screen--blocked .hero-copy {
  position: absolute !important;
  top: calc(148px * var(--figma-stage-scale)) !important;
  left: calc(54px * var(--figma-stage-scale)) !important;
  width: calc(266px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
}

.screen.predict-screen.predict-screen--blocked .page-title {
  width: calc(108px * var(--figma-stage-scale)) !important;
  margin: 0 auto !important;
}

.screen.predict-screen.predict-screen--blocked .predict-copy {
  width: calc(266px * var(--figma-stage-scale)) !important;
  margin: 0 auto !important;
}

.screen.predict-screen.predict-screen--blocked .predict-meta {
  position: absolute !important;
  top: calc(248px * var(--figma-stage-scale)) !important;
  left: calc(15px * var(--figma-stage-scale)) !important;
  width: calc(344px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
}

.screen.predict-screen.predict-screen--blocked .predict-meta__note {
  width: calc(116px * var(--figma-stage-scale)) !important;
}

.screen.predict-screen.predict-screen--blocked .predict-board {
  position: absolute !important;
  top: calc(280px * var(--figma-stage-scale)) !important;
  left: calc(16px * var(--figma-stage-scale)) !important;
  width: calc(343px * var(--figma-stage-scale)) !important;
  height: calc(532px * var(--figma-stage-scale)) !important;
  max-height: calc(532px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
  border-radius: calc(8px * var(--figma-stage-scale)) calc(8px * var(--figma-stage-scale)) 0 0 !important;
  background: #333 !important;
  overflow: hidden !important;
}

.screen.predict-screen.predict-screen--blocked .predict-list {
  height: calc(532px * var(--figma-stage-scale)) !important;
  max-height: calc(532px * var(--figma-stage-scale)) !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.screen.predict-screen.predict-screen--blocked .predict-card {
  padding: calc(16px * var(--figma-stage-scale)) 0 0 !important;
}

.screen.predict-screen.predict-screen--blocked .predict-card__head,
.screen.predict-screen.predict-screen--blocked .predict-row,
.screen.predict-screen.predict-screen--blocked .predict-locked-card,
.screen.predict-screen.predict-screen--blocked .predict-history-row {
  width: calc(285px * var(--figma-stage-scale)) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.screen.predict-screen.predict-screen--blocked .predict-history-row {
  min-height: calc(53px * var(--figma-stage-scale)) !important;
  padding: 0 !important;
}

.screen.predict-screen.predict-screen--blocked .predict-card__badge,
.screen.predict-screen.predict-screen--blocked .predict-history-row__badge {
  min-width: calc(82px * var(--figma-stage-scale)) !important;
  height: calc(29px * var(--figma-stage-scale)) !important;
  padding: 0 calc(10px * var(--figma-stage-scale)) !important;
  font-size: calc(16px * var(--figma-stage-scale)) !important;
  line-height: calc(21px * var(--figma-stage-scale)) !important;
}

.screen.predict-screen.predict-screen--blocked .screen__footer {
  position: absolute !important;
  top: calc(670px * var(--figma-stage-scale)) !important;
  left: var(--figma-cta-side-gap) !important;
  right: auto !important;
  bottom: auto !important;
  width: var(--figma-cta-width) !important;
  height: calc(52px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  background: none !important;
  overflow: visible !important;
  z-index: 7 !important;
}

.screen.predict-screen.predict-screen--blocked .screen__footer::before {
  content: "" !important;
  position: absolute !important;
  top: calc(-67px * var(--figma-stage-scale)) !important;
  left: calc(-29px * var(--figma-stage-scale)) !important;
  width: calc(343px * var(--figma-stage-scale)) !important;
  height: calc(209px * var(--figma-stage-scale)) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.24) 22%, rgba(255, 255, 255, 0.78) 58%, #fff 84%) !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

.screen.predict-screen.predict-screen--blocked .screen__footer .cta {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: var(--figma-cta-width) !important;
  height: calc(52px * var(--figma-stage-scale)) !important;
  min-height: calc(52px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
  z-index: 1 !important;
}

.screen.predict-screen.predict-screen--blocked .predict-footer-note {
  position: absolute !important;
  top: calc(734px * var(--figma-stage-scale)) !important;
  left: calc(108px * var(--figma-stage-scale)) !important;
  width: calc(159px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
  text-align: center !important;
  z-index: 7 !important;
}

/* 랭킹 — true EOF hard lock (Figma 198:4260) */
.screen.ranking {
  position: relative !important;
  left: 0 !important;
  right: auto !important;
  width: var(--figma-stage-width) !important;
  min-width: var(--figma-stage-width) !important;
  max-width: var(--figma-stage-width) !important;
  min-height: var(--device-height) !important;
  height: var(--device-height) !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #0068b7 !important;
  overflow: hidden !important;
  transform: none !important;
}

.screen.ranking::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: url('../mcp/exact/collection/pattern-tile.png?v=20260415-1') !important;
  background-repeat: repeat !important;
  background-size: calc(30px * var(--figma-stage-scale)) calc(30px * var(--figma-stage-scale)) !important;
  opacity: 0.2 !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

.screen.ranking .topbar,
.screen.ranking .topbar.is-dark {
  position: absolute !important;
  top: calc(var(--safe-top) + (70px * var(--figma-stage-scale))) !important;
  left: 50% !important;
  width: calc(344px * var(--figma-stage-scale)) !important;
  height: calc(30px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: translateX(-50%) !important;
  z-index: 5 !important;
}

.screen.ranking .topbar__button,
.screen.ranking .topbar__slot {
  width: calc(24px * var(--figma-stage-scale)) !important;
  height: calc(24px * var(--figma-stage-scale)) !important;
  min-width: calc(24px * var(--figma-stage-scale)) !important;
  min-height: calc(24px * var(--figma-stage-scale)) !important;
}

.screen.ranking .topbar__brand,
.screen.ranking .topbar__brand-lockup,
.screen.ranking .topbar__brand-image {
  width: calc(128px * var(--figma-stage-scale)) !important;
  height: calc(20px * var(--figma-stage-scale)) !important;
}

.screen.ranking .ranking__hero {
  position: absolute !important;
  inset: 0 0 auto 0 !important;
  width: var(--figma-stage-width) !important;
  height: calc(452px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
  z-index: 3 !important;
}

.screen.ranking .ranking__back {
  position: absolute !important;
  top: calc(387px * var(--figma-stage-scale)) !important;
  left: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: calc(24px * var(--figma-stage-scale)) !important;
  height: calc(38px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  z-index: 4 !important;
}

.screen.ranking .ranking__back img {
  display: block !important;
  width: calc(13.0833px * var(--figma-stage-scale)) !important;
  height: calc(24px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
}

.screen.ranking .ranking-podium {
  position: absolute !important;
  width: calc(109px * var(--figma-stage-scale)) !important;
  height: calc(152px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
  text-align: center !important;
}

.screen.ranking .ranking-podium--primary {
  top: calc(157px * var(--figma-stage-scale)) !important;
  left: calc(133px * var(--figma-stage-scale)) !important;
}

.screen.ranking .ranking-podium--secondary {
  top: calc(215px * var(--figma-stage-scale)) !important;
  left: calc(16px * var(--figma-stage-scale)) !important;
}

.screen.ranking .ranking-podium--tertiary {
  top: calc(246px * var(--figma-stage-scale)) !important;
  left: calc(250px * var(--figma-stage-scale)) !important;
}

.screen.ranking .ranking-podium__plate {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: calc(109px * var(--figma-stage-scale)) !important;
  height: calc(152px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
  object-fit: contain !important;
}

.screen.ranking .ranking-podium__copy {
  position: absolute !important;
  top: calc(12px * var(--figma-stage-scale)) !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 2 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: calc(4px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
  text-align: center !important;
  white-space: nowrap !important;
}

.screen.ranking .ranking-podium--tertiary .ranking-podium__copy {
  top: calc(14px * var(--figma-stage-scale)) !important;
}

.screen.ranking .ranking-podium__copy strong {
  margin: 0 !important;
  color: #2a2a2b !important;
  font-size: calc(24px * var(--figma-stage-scale)) !important;
  font-weight: 700 !important;
  line-height: calc(30px * var(--figma-stage-scale)) !important;
  letter-spacing: calc(-0.96px * var(--figma-stage-scale)) !important;
}

.screen.ranking .ranking-podium__copy span,
.screen.ranking .ranking-podium__copy em {
  margin: 0 !important;
  color: #2a2a2b !important;
  font-size: calc(12px * var(--figma-stage-scale)) !important;
  font-style: normal !important;
  font-weight: 500 !important;
  line-height: calc(16px * var(--figma-stage-scale)) !important;
  letter-spacing: 0 !important;
}

.screen.ranking .ranking-podium__copy span b,
.screen.ranking .ranking-podium__copy em b {
  color: #0068b7 !important;
  font-weight: 500 !important;
}

.screen.ranking .ranking-podium__medal {
  position: absolute !important;
  display: block !important;
  margin: 0 !important;
  z-index: 3 !important;
}

.screen.ranking .ranking-podium--primary .ranking-podium__medal {
  top: calc(91px * var(--figma-stage-scale)) !important;
  left: calc(33px * var(--figma-stage-scale)) !important;
  width: calc(43px * var(--figma-stage-scale)) !important;
  height: calc(61px * var(--figma-stage-scale)) !important;
}

.screen.ranking .ranking-podium--secondary .ranking-podium__medal {
  top: calc(90px * var(--figma-stage-scale)) !important;
  left: calc(32px * var(--figma-stage-scale)) !important;
  width: calc(44px * var(--figma-stage-scale)) !important;
  height: calc(62px * var(--figma-stage-scale)) !important;
}

.screen.ranking .ranking-podium--tertiary .ranking-podium__medal {
  top: calc(99px * var(--figma-stage-scale)) !important;
  left: calc(33px * var(--figma-stage-scale)) !important;
  width: calc(43px * var(--figma-stage-scale)) !important;
  height: calc(61px * var(--figma-stage-scale)) !important;
}

.screen.ranking .ranking__sheet {
  position: absolute !important;
  left: 0 !important;
  right: auto !important;
  bottom: 0 !important;
  width: var(--figma-stage-width) !important;
  max-width: var(--figma-stage-width) !important;
  height: calc(360px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
  padding: calc(29px * var(--figma-stage-scale)) calc(16px * var(--figma-stage-scale)) calc(48px * var(--figma-stage-scale)) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: calc(12px * var(--figma-stage-scale)) !important;
  background: #fff !important;
  border-radius: calc(32px * var(--figma-stage-scale)) calc(32px * var(--figma-stage-scale)) 0 0 !important;
  box-sizing: border-box !important;
  z-index: 2 !important;
}

.screen.ranking .ranking-row {
  display: grid !important;
  grid-template-columns: calc(20px * var(--figma-stage-scale)) calc(30px * var(--figma-stage-scale)) minmax(0, 1fr) auto !important;
  align-items: center !important;
  column-gap: calc(8px * var(--figma-stage-scale)) !important;
  width: calc(343px * var(--figma-stage-scale)) !important;
  min-height: calc(21px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
  padding: 0 !important;
}

.screen.ranking .ranking-row + .ranking-row {
  margin-top: 0 !important;
}

.screen.ranking .ranking-row__rank,
.screen.ranking .ranking-row__name,
.screen.ranking .ranking-row__points {
  color: #2a2a2b !important;
  font-size: calc(16px * var(--figma-stage-scale)) !important;
  font-weight: 500 !important;
  line-height: calc(21px * var(--figma-stage-scale)) !important;
  letter-spacing: calc(-0.32px * var(--figma-stage-scale)) !important;
}

.screen.ranking .ranking-row__rank {
  width: calc(20px * var(--figma-stage-scale)) !important;
  text-align: left !important;
}

.screen.ranking .ranking-row__team {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: calc(30px * var(--figma-stage-scale)) !important;
  height: calc(30px * var(--figma-stage-scale)) !important;
}

.screen.ranking .ranking-row__team img {
  display: block !important;
  width: calc(30px * var(--figma-stage-scale)) !important;
  height: calc(30px * var(--figma-stage-scale)) !important;
  object-fit: contain !important;
}

.screen.ranking .ranking-row__name {
  min-width: 0 !important;
  white-space: nowrap !important;
}

.screen.ranking .ranking-row__points {
  text-align: right !important;
}

.screen.ranking .ranking-row__points strong {
  color: #0068b7 !important;
  font-weight: 500 !important;
}

.screen.ranking .ranking__pager {
  position: absolute !important;
  left: 50% !important;
  bottom: calc(30px * var(--figma-stage-scale)) !important;
  width: calc(68px * var(--figma-stage-scale)) !important;
  height: calc(8px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
  transform: translateX(-50%) !important;
  display: block !important;
  filter: drop-shadow(0 0 calc(8px * var(--figma-stage-scale)) rgba(0, 0, 0, 0.5)) !important;
}

/* 랭킹 — TRUE EOF hard lock */
.ranking {
  position: relative !important;
  left: 0 !important;
  right: auto !important;
  width: 100% !important;
  min-height: var(--device-height) !important;
  margin: 0 !important;
  transform: none !important;
  overflow: hidden !important;
  background: #0068b7 !important;
  isolation: isolate !important;
}

.ranking::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background-color: #0068b7 !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200' viewBox='0 0 200 200'%3E%3Cg fill='none' fill-rule='evenodd' stroke='rgba(255,255,255,0.1)' stroke-width='1.5'%3E%3Cpath d='M100 43c12 0 22 10 22 22s-10 22-22 22S78 77 78 65s10-22 22-22Z'/%3E%3Cpath d='M100 113c12 0 22 10 22 22s-10 22-22 22-22-10-22-22 10-22 22-22Z'/%3E%3Cpath d='M65 78c12 0 22 10 22 22s-10 22-22 22-22-10-22-22 10-22 22-22Z'/%3E%3Cpath d='M135 78c12 0 22 10 22 22s-10 22-22 22-22-10-22-22 10-22 22-22Z'/%3E%3C/g%3E%3C/svg%3E") !important;
  background-size: calc(200px * var(--figma-stage-scale)) calc(200px * var(--figma-stage-scale)) !important;
  opacity: 0.38 !important;
  pointer-events: none !important;
  z-index: -1 !important;
}

.ranking .topbar,
.ranking .topbar.is-dark {
  top: calc(var(--safe-top) + (22px * var(--figma-stage-scale))) !important;
  left: calc(16px * var(--figma-stage-scale)) !important;
  width: calc(344px * var(--figma-stage-scale)) !important;
  transform: none !important;
}

.ranking__hero {
  position: relative !important;
  width: 100% !important;
  height: calc(452px * var(--figma-stage-scale)) !important;
}

.ranking__back {
  position: absolute !important;
  left: 0 !important;
  top: calc(387px * var(--figma-stage-scale)) !important;
  width: calc(24px * var(--figma-stage-scale)) !important;
  height: calc(38px * var(--figma-stage-scale)) !important;
  padding: 0 !important;
}

.ranking__back img {
  width: 100% !important;
  height: 100% !important;
}

.ranking__sheet {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  height: calc(360px * var(--figma-stage-scale)) !important;
  padding: calc(29px * var(--figma-stage-scale)) calc(16px * var(--figma-stage-scale)) calc(30px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
  border-radius: calc(32px * var(--figma-stage-scale)) calc(32px * var(--figma-stage-scale)) 0 0 !important;
  background: #fff !important;
}

.ranking__pager {
  position: absolute !important;
  left: 50% !important;
  bottom: calc(30px * var(--figma-stage-scale)) !important;
  width: calc(68px * var(--figma-stage-scale)) !important;
  height: calc(8px * var(--figma-stage-scale)) !important;
  transform: translateX(-50%) !important;
}

/* 승/패 예측 — EOF relock from Figma 243:8740 */
.predict-screen {
  position: relative !important;
  overflow: hidden !important;
  background: #ffffff !important;
}

.predict-screen .topbar,
.predict-screen .topbar.is-dark {
  top: calc(var(--safe-top) + (22px * var(--figma-stage-scale))) !important;
  z-index: 8 !important;
}

.predict-screen .screen__body {
  position: relative !important;
  width: var(--figma-stage-width) !important;
  min-height: var(--device-height) !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.predict-screen .predict--figma {
  position: relative !important;
  width: var(--figma-stage-width) !important;
  min-height: var(--device-height) !important;
  padding: 0 !important;
}

.predict-screen .hero-copy {
  position: absolute !important;
  top: calc(148px * var(--figma-stage-scale)) !important;
  left: 50% !important;
  width: calc(266px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
  transform: translateX(-50%) !important;
  display: grid !important;
  justify-items: center !important;
  gap: calc(8px * var(--figma-stage-scale)) !important;
  z-index: 3 !important;
}

.predict-screen .page-title {
  width: calc(108px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
  color: #0068b7 !important;
  font-size: calc(24px * var(--figma-stage-scale)) !important;
  font-weight: 700 !important;
  line-height: calc(30px * var(--figma-stage-scale)) !important;
  letter-spacing: calc(-0.96px * var(--figma-stage-scale)) !important;
  text-align: center !important;
}

.predict-screen .predict-copy {
  width: 100% !important;
  margin: 0 !important;
  color: #2a2a2b !important;
  font-size: calc(16px * var(--figma-stage-scale)) !important;
  font-weight: 500 !important;
  line-height: calc(21px * var(--figma-stage-scale)) !important;
  letter-spacing: calc(-0.32px * var(--figma-stage-scale)) !important;
  text-align: center !important;
}

.predict-screen .predict-meta {
  position: absolute !important;
  top: calc(248px * var(--figma-stage-scale)) !important;
  left: calc(15px * var(--figma-stage-scale)) !important;
  width: calc(344px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: calc(12px * var(--figma-stage-scale)) !important;
  z-index: 4 !important;
}

.predict-screen .predict-meta__note,
.predict-screen .predict-toggle span {
  margin: 0 !important;
  font-size: calc(12px * var(--figma-stage-scale)) !important;
  font-weight: 500 !important;
  line-height: calc(16px * var(--figma-stage-scale)) !important;
  letter-spacing: calc(-0.24px * var(--figma-stage-scale)) !important;
}

.predict-screen .predict-meta__note {
  color: #0068b7 !important;
}

.predict-screen .predict-toggle {
  gap: calc(4px * var(--figma-stage-scale)) !important;
}

.predict-screen .predict-toggle input {
  width: calc(20px * var(--figma-stage-scale)) !important;
  height: calc(20px * var(--figma-stage-scale)) !important;
  flex: 0 0 calc(20px * var(--figma-stage-scale)) !important;
}

.predict-screen .predict-board {
  position: absolute !important;
  top: calc(280px * var(--figma-stage-scale)) !important;
  left: calc(16px * var(--figma-stage-scale)) !important;
  width: calc(343px * var(--figma-stage-scale)) !important;
  height: calc(532px * var(--figma-stage-scale)) !important;
  max-height: calc(532px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
  border-radius: calc(8px * var(--figma-stage-scale)) calc(8px * var(--figma-stage-scale)) 0 0 !important;
  overflow: hidden !important;
  z-index: 2 !important;
}

.predict-screen .predict-list {
  height: 100% !important;
  max-height: none !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.predict-screen .predict-card {
  padding-top: calc(16px * var(--figma-stage-scale)) !important;
}

.predict-screen .predict-card__head,
.predict-screen .predict-row,
.predict-screen .predict-locked-card,
.predict-screen .predict-history-row {
  width: calc(285px * var(--figma-stage-scale)) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.predict-screen .predict-card__badge,
.predict-screen .predict-history-row__badge {
  min-width: calc(82px * var(--figma-stage-scale)) !important;
  height: calc(29px * var(--figma-stage-scale)) !important;
  padding: 0 calc(10px * var(--figma-stage-scale)) !important;
  font-size: calc(16px * var(--figma-stage-scale)) !important;
  font-weight: 500 !important;
  line-height: calc(21px * var(--figma-stage-scale)) !important;
  letter-spacing: calc(-0.32px * var(--figma-stage-scale)) !important;
}

.predict-screen .screen__footer {
  position: absolute !important;
  top: calc(670px * var(--figma-stage-scale)) !important;
  left: 50% !important;
  right: auto !important;
  bottom: auto !important;
  width: calc(285px * var(--figma-stage-scale)) !important;
  height: calc(52px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  background: none !important;
  overflow: visible !important;
  transform: translateX(-50%) !important;
  z-index: 7 !important;
}

.predict-screen .screen__footer::before {
  content: "" !important;
  position: absolute !important;
  top: calc(-67px * var(--figma-stage-scale)) !important;
  left: calc(-29px * var(--figma-stage-scale)) !important;
  width: calc(343px * var(--figma-stage-scale)) !important;
  height: calc(209px * var(--figma-stage-scale)) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.24) 22%, rgba(255, 255, 255, 0.78) 58%, #fff 84%) !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

.predict-screen .screen__footer .cta {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: calc(285px * var(--figma-stage-scale)) !important;
  height: calc(52px * var(--figma-stage-scale)) !important;
  min-height: calc(52px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
  z-index: 1 !important;
}

.predict-screen .predict-footer-note {
  position: absolute !important;
  top: calc(64px * var(--figma-stage-scale)) !important;
  left: 50% !important;
  width: calc(159px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
  color: #ff0000 !important;
  font-size: calc(12px * var(--figma-stage-scale)) !important;
  font-weight: 300 !important;
  line-height: calc(16px * var(--figma-stage-scale)) !important;
  letter-spacing: calc(-0.24px * var(--figma-stage-scale)) !important;
  text-align: center !important;
  transform: translateX(-50%) !important;
  z-index: 7 !important;
}

.predict-screen.predict-screen--main .hero-copy,
.predict-screen.predict-screen--picked .hero-copy,
.predict-screen.predict-screen--blocked .hero-copy,
.predict-screen.predict-screen--blocked .predict--figma .hero-copy {
  top: calc(126px * var(--figma-stage-scale)) !important;
  left: 50% !important;
  width: calc(266px * var(--figma-stage-scale)) !important;
  transform: translateX(-50%) !important;
}

.predict-screen.predict-screen--main .page-title,
.predict-screen.predict-screen--picked .page-title,
.predict-screen.predict-screen--blocked .page-title {
  width: 108px !important;
  font-size: 24px !important;
  line-height: 30px !important;
  letter-spacing: -0.96px !important;
}

.predict-screen.predict-screen--main .predict-copy,
.predict-screen.predict-screen--picked .predict-copy,
.predict-screen.predict-screen--blocked .predict-copy {
  font-size: 16px !important;
  line-height: 21px !important;
  letter-spacing: -0.32px !important;
}

.predict-screen.predict-screen--main .predict-meta__note,
.predict-screen.predict-screen--picked .predict-meta__note,
.predict-screen.predict-screen--blocked .predict-meta__note,
.predict-screen.predict-screen--main .predict-toggle span,
.predict-screen.predict-screen--picked .predict-toggle span,
.predict-screen.predict-screen--blocked .predict-toggle span {
  font-size: 12px !important;
  line-height: 16px !important;
  letter-spacing: -0.24px !important;
}

.predict-screen.predict-screen--main .predict-meta,
.predict-screen.predict-screen--picked .predict-meta,
.predict-screen.predict-screen--blocked .predict-meta {
  top: calc(224px * var(--figma-stage-scale)) !important;
  left: calc(16px * var(--figma-stage-scale)) !important;
  width: calc(343px * var(--figma-stage-scale)) !important;
}

.predict-screen.predict-screen--main .predict-board,
.predict-screen.predict-screen--picked .predict-board,
.predict-screen.predict-screen--blocked .predict-board {
  top: calc(254px * var(--figma-stage-scale)) !important;
  left: calc(16px * var(--figma-stage-scale)) !important;
  width: calc(343px * var(--figma-stage-scale)) !important;
  height: calc(532px * var(--figma-stage-scale)) !important;
  max-height: calc(532px * var(--figma-stage-scale)) !important;
}

.predict-screen.predict-screen--main .screen__footer,
.predict-screen.predict-screen--picked .screen__footer,
.predict-screen.predict-screen--blocked .screen__footer {
  top: calc(646px * var(--figma-stage-scale)) !important;
  left: 50% !important;
  width: calc(285px * var(--figma-stage-scale)) !important;
  transform: translateX(-50%) !important;
}

.predict-screen.predict-screen--main .screen__footer::before,
.predict-screen.predict-screen--picked .screen__footer::before,
.predict-screen.predict-screen--blocked .screen__footer::before {
  top: calc(-56px * var(--figma-stage-scale)) !important;
  left: calc(-29px * var(--figma-stage-scale)) !important;
  width: calc(343px * var(--figma-stage-scale)) !important;
  height: calc(186px * var(--figma-stage-scale)) !important;
}

.predict-screen.predict-screen--main .predict-footer-note,
.predict-screen.predict-screen--picked .predict-footer-note,
.predict-screen.predict-screen--blocked .predict-footer-note {
  top: calc(54px * var(--figma-stage-scale)) !important;
  left: 50% !important;
  width: calc(159px * var(--figma-stage-scale)) !important;
  transform: translateX(-50%) !important;
}

/* 랭킹 — EOF relock from Figma 198:4260 */
.ranking {
  position: relative !important;
  left: 0 !important;
  right: auto !important;
  width: calc(100% + var(--figma-cta-side-gap)) !important;
  min-height: var(--device-height) !important;
  margin: 0 0 0 calc(-1 * var(--figma-cta-side-gap)) !important;
  transform: none !important;
  overflow: hidden !important;
  background: #0068b7 !important;
  isolation: isolate !important;
}

.ranking::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background-color: #0068b7 !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200' viewBox='0 0 200 200'%3E%3Cg fill='none' fill-rule='evenodd' stroke='rgba(255,255,255,0.1)' stroke-width='1.5'%3E%3Cpath d='M100 43c12 0 22 10 22 22s-10 22-22 22S78 77 78 65s10-22 22-22Z'/%3E%3Cpath d='M100 113c12 0 22 10 22 22s-10 22-22 22-22-10-22-22 10-22 22-22Z'/%3E%3Cpath d='M65 78c12 0 22 10 22 22s-10 22-22 22-22-10-22-22 10-22 22-22Z'/%3E%3Cpath d='M135 78c12 0 22 10 22 22s-10 22-22 22-22-10-22-22 10-22 22-22Z'/%3E%3C/g%3E%3C/svg%3E") !important;
  background-size: calc(200px * var(--figma-stage-scale)) calc(200px * var(--figma-stage-scale)) !important;
  opacity: 0.38 !important;
  pointer-events: none !important;
  z-index: -1 !important;
}

.ranking .topbar,
.ranking .topbar.is-dark {
  top: calc(var(--safe-top) + (22px * var(--figma-stage-scale))) !important;
  left: calc(16px * var(--figma-stage-scale)) !important;
  width: calc(344px * var(--figma-stage-scale)) !important;
}

.ranking__hero {
  position: relative !important;
  width: 100% !important;
  height: calc(452px * var(--figma-stage-scale)) !important;
}

.ranking__back {
  position: absolute !important;
  left: 0 !important;
  top: calc(387px * var(--figma-stage-scale)) !important;
  width: calc(24px * var(--figma-stage-scale)) !important;
  height: calc(38px * var(--figma-stage-scale)) !important;
  padding: 0 !important;
}

.ranking__back img {
  width: 100% !important;
  height: 100% !important;
}

.ranking__sheet {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  height: calc(360px * var(--figma-stage-scale)) !important;
  padding: calc(29px * var(--figma-stage-scale)) calc(16px * var(--figma-stage-scale)) calc(30px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
  border-radius: calc(32px * var(--figma-stage-scale)) calc(32px * var(--figma-stage-scale)) 0 0 !important;
  background: #fff !important;
}

.ranking__pager {
  position: absolute !important;
  left: 50% !important;
  bottom: calc(30px * var(--figma-stage-scale)) !important;
  width: calc(68px * var(--figma-stage-scale)) !important;
  height: calc(8px * var(--figma-stage-scale)) !important;
  transform: translateX(-50%) !important;
}

/* 랭킹 — final last-wins exact lock */
.ranking {
  position: relative !important;
  width: var(--figma-stage-width) !important;
  max-width: var(--figma-stage-width) !important;
  min-height: var(--device-height) !important;
  height: var(--device-height) !important;
  margin: 0 auto !important;
  padding: 0 !important;
  background: #0068b7 !important;
  overflow: hidden !important;
}

.ranking::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3E%3Cg fill='%23ffffff' fill-opacity='0.2'%3E%3Ccircle cx='15' cy='7.5' r='4'/%3E%3Ccircle cx='7.5' cy='15' r='4'/%3E%3Ccircle cx='22.5' cy='15' r='4'/%3E%3Ccircle cx='15' cy='22.5' r='4'/%3E%3Ccircle cx='15' cy='15' r='1.7'/%3E%3C/g%3E%3C/svg%3E") !important;
  background-repeat: repeat !important;
  background-size: calc(30px * var(--figma-stage-scale)) calc(30px * var(--figma-stage-scale)) !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

.ranking .topbar,
.ranking .topbar.is-dark {
  position: absolute !important;
  top: calc(var(--safe-top) + (70px * var(--figma-stage-scale))) !important;
  left: 50% !important;
  width: calc(344px * var(--figma-stage-scale)) !important;
  height: calc(30px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: translateX(-50%) !important;
  z-index: 5 !important;
}

.ranking .topbar__button,
.ranking .topbar__slot {
  width: calc(24px * var(--figma-stage-scale)) !important;
  height: calc(24px * var(--figma-stage-scale)) !important;
  min-width: calc(24px * var(--figma-stage-scale)) !important;
  min-height: calc(24px * var(--figma-stage-scale)) !important;
}

.ranking .topbar__brand,
.ranking .topbar__brand-lockup,
.ranking .topbar__brand-image {
  width: calc(128px * var(--figma-stage-scale)) !important;
  height: calc(20px * var(--figma-stage-scale)) !important;
}

.ranking__hero {
  position: absolute !important;
  inset: 0 0 auto 0 !important;
  width: var(--figma-stage-width) !important;
  height: calc(452px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
  z-index: 3 !important;
}

.ranking__back {
  position: absolute !important;
  top: calc(387px * var(--figma-stage-scale)) !important;
  left: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: calc(24px * var(--figma-stage-scale)) !important;
  height: calc(38px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  z-index: 4 !important;
}

.ranking__back img {
  display: block !important;
  width: calc(13.0833px * var(--figma-stage-scale)) !important;
  height: calc(24px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
}

.ranking-podium {
  position: absolute !important;
  width: calc(109px * var(--figma-stage-scale)) !important;
  height: calc(152px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
  text-align: center !important;
}

.ranking-podium--primary {
  top: calc(157px * var(--figma-stage-scale)) !important;
  left: calc(133px * var(--figma-stage-scale)) !important;
}

.ranking-podium--secondary {
  top: calc(215px * var(--figma-stage-scale)) !important;
  left: calc(16px * var(--figma-stage-scale)) !important;
}

.ranking-podium--tertiary {
  top: calc(246px * var(--figma-stage-scale)) !important;
  left: calc(250px * var(--figma-stage-scale)) !important;
}

.ranking-podium__plate {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: calc(109px * var(--figma-stage-scale)) !important;
  height: calc(152px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
  object-fit: contain !important;
}

.ranking-podium__copy {
  position: absolute !important;
  top: calc(12px * var(--figma-stage-scale)) !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 2 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: calc(4px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
  text-align: center !important;
  white-space: nowrap !important;
}

.ranking-podium--tertiary .ranking-podium__copy {
  top: calc(14px * var(--figma-stage-scale)) !important;
}

.ranking-podium__copy strong {
  margin: 0 !important;
  color: #2a2a2b !important;
  font-size: calc(24px * var(--figma-stage-scale)) !important;
  font-weight: 700 !important;
  line-height: calc(30px * var(--figma-stage-scale)) !important;
  letter-spacing: calc(-0.96px * var(--figma-stage-scale)) !important;
}

.ranking-podium__copy span,
.ranking-podium__copy em {
  margin: 0 !important;
  color: #2a2a2b !important;
  font-size: calc(12px * var(--figma-stage-scale)) !important;
  font-style: normal !important;
  font-weight: 500 !important;
  line-height: calc(16px * var(--figma-stage-scale)) !important;
  letter-spacing: 0 !important;
}

.ranking-podium__copy span b,
.ranking-podium__copy em b {
  color: #0068b7 !important;
  font-weight: 500 !important;
}

.ranking-podium__medal {
  position: absolute !important;
  display: block !important;
  margin: 0 !important;
  z-index: 3 !important;
}

.ranking-podium--primary .ranking-podium__medal {
  top: calc(91px * var(--figma-stage-scale)) !important;
  left: calc(33px * var(--figma-stage-scale)) !important;
  width: calc(43px * var(--figma-stage-scale)) !important;
  height: calc(61px * var(--figma-stage-scale)) !important;
}

.ranking-podium--secondary .ranking-podium__medal {
  top: calc(90px * var(--figma-stage-scale)) !important;
  left: calc(32px * var(--figma-stage-scale)) !important;
  width: calc(44px * var(--figma-stage-scale)) !important;
  height: calc(62px * var(--figma-stage-scale)) !important;
}

.ranking-podium--tertiary .ranking-podium__medal {
  top: calc(99px * var(--figma-stage-scale)) !important;
  left: calc(33px * var(--figma-stage-scale)) !important;
  width: calc(43px * var(--figma-stage-scale)) !important;
  height: calc(61px * var(--figma-stage-scale)) !important;
}

.ranking__sheet {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: var(--figma-stage-width) !important;
  height: calc(360px * var(--figma-stage-scale)) !important;
  margin: 0 auto !important;
  padding: calc(29px * var(--figma-stage-scale)) calc(16px * var(--figma-stage-scale)) calc(48px * var(--figma-stage-scale)) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: calc(12px * var(--figma-stage-scale)) !important;
  background: #fff !important;
  border-radius: calc(32px * var(--figma-stage-scale)) calc(32px * var(--figma-stage-scale)) 0 0 !important;
  z-index: 2 !important;
}

.ranking-row {
  display: grid !important;
  grid-template-columns: calc(20px * var(--figma-stage-scale)) calc(30px * var(--figma-stage-scale)) minmax(0, 1fr) auto !important;
  align-items: center !important;
  column-gap: calc(8px * var(--figma-stage-scale)) !important;
  width: calc(343px * var(--figma-stage-scale)) !important;
  min-height: calc(21px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
  padding: 0 !important;
}

.ranking-row + .ranking-row {
  margin-top: 0 !important;
}

.ranking-row__rank,
.ranking-row__name,
.ranking-row__points {
  color: #2a2a2b !important;
  font-size: calc(16px * var(--figma-stage-scale)) !important;
  font-weight: 500 !important;
  line-height: calc(21px * var(--figma-stage-scale)) !important;
  letter-spacing: calc(-0.32px * var(--figma-stage-scale)) !important;
}

.ranking-row__rank {
  width: calc(20px * var(--figma-stage-scale)) !important;
  text-align: left !important;
}

.ranking-row__team {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: calc(30px * var(--figma-stage-scale)) !important;
  height: calc(30px * var(--figma-stage-scale)) !important;
}

.ranking-row__team img {
  display: block !important;
  width: calc(30px * var(--figma-stage-scale)) !important;
  height: calc(30px * var(--figma-stage-scale)) !important;
  object-fit: contain !important;
}

.ranking-row__name {
  min-width: 0 !important;
  white-space: nowrap !important;
}

.ranking-row__points {
  text-align: right !important;
}

.ranking-row__points strong {
  color: #0068b7 !important;
  font-weight: 500 !important;
}

.ranking__pager {
  position: absolute !important;
  left: 50% !important;
  bottom: calc(30px * var(--figma-stage-scale)) !important;
  width: calc(68px * var(--figma-stage-scale)) !important;
  height: calc(8px * var(--figma-stage-scale)) !important;
  margin: 0 !important;
  transform: translateX(-50%) !important;
  display: block !important;
  filter: drop-shadow(0 0 calc(8px * var(--figma-stage-scale)) rgba(0, 0, 0, 0.5)) !important;
}

/* 경험 공유 상세 — EOF exact lock */
.community-screen--detail {
  position: relative !important;
  width: 375px !important;
  max-width: 100% !important;
  min-height: 812px !important;
  overflow: hidden !important;
}

.community-screen--detail .topbar {
  position: absolute !important;
  top: calc(var(--safe-top) + 18px) !important;
  left: 50% !important;
  width: 344px !important;
  transform: translateX(-50%) !important;
  z-index: 4 !important;
}

.community-screen--detail .community-screen__body {
  position: relative !important;
  width: 375px !important;
  min-height: 812px !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

.community-screen--detail .page-title {
  position: absolute !important;
  top: 148px !important;
  left: 36px !important;
  width: 302px !important;
  margin: 0 !important;
  text-align: center !important;
}

.community-screen--detail .community-screen__lead {
  position: absolute !important;
  top: 186px !important;
  left: 84px !important;
  width: 206px !important;
  margin: 0 !important;
  text-align: center !important;
}

.community-screen--detail .community-card--detail {
  position: absolute !important;
  top: 240px !important;
  left: 12px !important;
  width: 351px !important;
  height: 416px !important;
  min-height: 416px !important;
  padding: 20px 8px !important;
  gap: 22px !important;
  border: 2px solid #0068b7 !important;
  border-radius: 8px !important;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.25) !important;
  background: #ffffff !important;
  overflow: hidden !important;
}

.community-screen--detail .community-card__head,
.community-screen--detail .community-card__footer {
  width: 334px !important;
  margin: 0 auto !important;
}

.community-screen--detail .community-card__head {
  align-items: flex-start !important;
}

.community-screen--detail .community-card__title-row {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.community-screen--detail .community-card__title-row strong {
  color: #2a2a2b !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 21px !important;
  letter-spacing: -0.32px !important;
}

.community-screen--detail .community-card__title-row span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 24px !important;
  padding: 4px 8px !important;
  border-radius: 8px !important;
  background: #e3e3e3 !important;
  color: #8c8c8c !important;
  font-size: 12px !important;
  font-weight: 300 !important;
  line-height: 16px !important;
  letter-spacing: -0.24px !important;
}

.community-screen--detail .community-card__close {
  width: 24px !important;
  height: 24px !important;
  padding: 0 !important;
}

.community-screen--detail .community-card__close img {
  width: 24px !important;
  height: 24px !important;
}

.community-screen--detail .community-card__photo {
  width: 334px !important;
  height: 267px !important;
  margin: 0 auto !important;
  border-radius: 8px !important;
  background: rgba(0, 104, 183, 0.4) !important;
}

.community-screen--detail .community-card__photo > .community-placeholder,
.community-screen--detail .community-card__photo-icon,
.community-screen--detail .community-placeholder__asset {
  width: 32px !important;
  height: 32px !important;
}

.community-screen--detail .community-card__photo-icon::before,
.community-screen--detail .community-card__photo-icon::after,
.community-screen--detail .community-placeholder::before,
.community-screen--detail .community-placeholder::after {
  content: none !important;
  display: none !important;
}

.community-screen--detail .community-card__footer {
  align-items: flex-end !important;
  gap: 8px !important;
}

.community-screen--detail .community-card__footer p {
  max-width: 246px !important;
  margin: 0 !important;
  color: #2a2a2b !important;
  font-size: 14px !important;
  font-weight: 300 !important;
  line-height: 20px !important;
  letter-spacing: -0.56px !important;
}

.community-screen--detail .community-card__like {
  min-width: 80px !important;
  width: auto !important;
  padding: 0 !important;
  gap: 0 !important;
  align-items: flex-end !important;
  justify-content: flex-end !important;
}

.community-screen--detail .community-card__like span {
  color: #2a2a2b !important;
  font-size: 14px !important;
  font-weight: 300 !important;
  line-height: 20px !important;
  letter-spacing: -0.56px !important;
  white-space: nowrap !important;
}

.community-screen--detail .community-card__heart,
.community-screen--detail .community-card__heart img {
  width: 32px !important;
  height: 32px !important;
}

.community-screen--detail .screen__footer--community {
  position: absolute !important;
  top: 670px !important;
  left: 45px !important;
  width: 285px !important;
  height: 52px !important;
  margin: 0 !important;
  padding: 0 !important;
  z-index: 3 !important;
}

.community-screen--detail .screen__footer--community .cta {
  width: 285px !important;
  height: 52px !important;
  min-height: 52px !important;
  margin: 0 !important;
}

.community-screen--detail .community-screen__notice {
  position: absolute !important;
  top: 734px !important;
  left: 98px !important;
  width: 179px !important;
  margin: 0 !important;
  color: #ff0000 !important;
  font-size: 12px !important;
  font-weight: 300 !important;
  line-height: 16px !important;
  letter-spacing: -0.24px !important;
  text-align: center !important;
}

/* 나의 인증 작성 — EOF exact lock */
.community-me {
  position: relative !important;
  width: 375px !important;
  max-width: 100% !important;
  min-height: 812px !important;
  overflow: hidden !important;
}

.community-me .screen__body {
  position: relative !important;
  width: 375px !important;
  min-height: 812px !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

.community-me__back {
  position: absolute !important;
  top: 141px !important;
  left: 16px !important;
  width: 24px !important;
  height: 24px !important;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
  z-index: 3 !important;
}

.community-me__back img {
  width: 24px !important;
  height: 24px !important;
}

.community-me .page-title {
  position: absolute !important;
  top: 189px !important;
  left: 55px !important;
  width: 266px !important;
  margin: 0 !important;
  text-align: center !important;
}

.community-me__field--title {
  position: absolute !important;
  top: 243px !important;
  left: 16px !important;
  width: 343px !important;
  margin: 0 !important;
}

.community-me__field strong {
  display: block !important;
  margin-bottom: 8px !important;
  color: #2a2a2b !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 21px !important;
  letter-spacing: -0.32px !important;
}

.community-me__title-input {
  height: 38px !important;
  padding: 8px 4px !important;
  border-bottom: 1px solid #8c8c8c !important;
  color: #8c8c8c !important;
  font-size: 16px !important;
  font-weight: 300 !important;
  line-height: 21px !important;
  letter-spacing: -0.32px !important;
}

.community-me__editor {
  position: absolute !important;
  top: 330px !important;
  left: 16px !important;
  width: 343px !important;
  height: 302px !important;
  margin: 0 !important;
  gap: 4px !important;
}

.community-me__textarea {
  min-height: 260px !important;
  height: 260px !important;
  padding: 0 8px 0 0 !important;
  border-radius: 8px !important;
  background: #f0f0f0 !important;
  color: #8c8c8c !important;
  font-size: 16px !important;
  font-weight: 300 !important;
  line-height: 21px !important;
  letter-spacing: -0.32px !important;
}

.community-me__editor p {
  margin: 0 !important;
  padding-right: 4px !important;
  color: #8c8c8c !important;
  font-size: 12px !important;
  font-weight: 300 !important;
  line-height: 16px !important;
  letter-spacing: -0.24px !important;
  text-align: right !important;
}

.community-me__upload {
  position: absolute !important;
  top: 612px !important;
  left: 16px !important;
  width: 80px !important;
  height: 80px !important;
  margin: 0 !important;
  border: 2px solid #b7b7b7 !important;
  border-radius: 8px !important;
  background: #fff !important;
}

.community-me__upload-icon img,
.community-me__upload-action img {
  width: 24px !important;
  height: 24px !important;
}

.community-me__upload-preview,
.community-me__upload-preview--sample {
  width: 80px !important;
  height: 80px !important;
}

.community-me__upload-action {
  top: -8px !important;
  right: -8px !important;
  width: 24px !important;
  height: 24px !important;
}

.community-me .screen__footer {
  position: absolute !important;
  top: 660px !important;
  left: 45px !important;
  width: 285px !important;
  height: 52px !important;
  margin: 0 !important;
  padding: 0 !important;
  z-index: 2 !important;
}

.community-me .screen__footer .cta {
  width: 285px !important;
  height: 52px !important;
  min-height: 52px !important;
  margin: 0 !important;
}

.community-me__notice {
  position: absolute !important;
  top: 723px !important;
  left: 45px !important;
  width: 285px !important;
  margin: 0 !important;
  color: #ff0000 !important;
  font-size: 12px !important;
  font-weight: 300 !important;
  line-height: 16px !important;
  letter-spacing: -0.24px !important;
  text-align: center !important;
}

/* 사진 액션시트 — EOF exact lock */
.community-me .community-sheet-backdrop {
  position: fixed !important;
  inset: 0 !important;
  border: 0 !important;
  background: rgba(0, 0, 0, 0.5) !important;
  z-index: 28 !important;
}

.community-me .community-action-sheet {
  position: fixed !important;
  left: 50% !important;
  bottom: 31px !important;
  width: 359px !important;
  margin: 0 !important;
  transform: translateX(-50%) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  z-index: 30 !important;
}

.community-me .community-action-sheet__group {
  overflow: hidden !important;
  border-radius: 13px !important;
  backdrop-filter: blur(11px) !important;
  background: rgba(42, 42, 43, 0.4) !important;
}

.community-me .community-action-sheet__group button,
.community-me .community-action-sheet__cancel {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 359px !important;
  height: 60px !important;
  min-height: 60px !important;
  padding: 18px 16px !important;
  border: 0 !important;
  margin: 0 !important;
  background: rgba(42, 42, 43, 0.4) !important;
  color: #ffffff !important;
  font-size: 20px !important;
  line-height: 24px !important;
  letter-spacing: 0.38px !important;
}

.community-me .community-action-sheet__group button {
  font-weight: 600 !important;
}

.community-me .community-action-sheet__separator {
  display: block !important;
  width: 100% !important;
  height: 1px !important;
}

.community-me .community-action-sheet__cancel {
  border-radius: 13px !important;
  backdrop-filter: blur(40px) !important;
  font-weight: 700 !important;
}

/* 업로드 확인 / 완료 — EOF exact lock */
.community-me .modal-backdrop--community {
  position: fixed !important;
  inset: 0 !important;
  border: 0 !important;
  background: rgba(0, 0, 0, 0.5) !important;
  z-index: 28 !important;
}

.community-me .community-confirm-modal {
  position: fixed !important;
  top: 50% !important;
  left: 50% !important;
  width: 285px !important;
  padding: 36px 0 22px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 20px !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25) !important;
  transform: translate(-50%, -50%) !important;
  z-index: 31 !important;
}

.community-me .community-confirm-modal__copy {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 12px !important;
  width: 100% !important;
  padding: 0 24px !important;
  box-sizing: border-box !important;
}

.community-me .community-confirm-modal__title {
  margin: 0 !important;
  color: #2a2a2b !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 21px !important;
  letter-spacing: -0.32px !important;
  text-align: center !important;
}

.community-me .community-confirm-modal__caption {
  margin: 0 !important;
  color: #ff0000 !important;
  font-size: 14px !important;
  font-weight: 300 !important;
  line-height: 20px !important;
  letter-spacing: -0.56px !important;
  text-align: center !important;
}

.community-me .community-confirm-modal__actions {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  width: 234px !important;
  margin: 0 auto !important;
}

.community-me .community-confirm-modal__button {
  width: 109px !important;
  height: 52px !important;
  min-height: 52px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: #f0f0f0 !important;
  color: #2a2a2b !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 21px !important;
  letter-spacing: -0.32px !important;
}

.community-me .community-confirm-modal__button.is-primary {
  background: #0068b7 !important;
  color: #ffffff !important;
}

.community-me .community-success-toast {
  position: fixed !important;
  top: 620px !important;
  left: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 37px !important;
  padding: 8px 20px !important;
  border-radius: 8px !important;
  backdrop-filter: blur(2px) !important;
  background: rgba(0, 0, 0, 0.4) !important;
  color: #f7f7f7 !important;
  font-size: 16px !important;
  font-weight: 300 !important;
  line-height: 21px !important;
  letter-spacing: -0.32px !important;
  white-space: nowrap !important;
  transform: translateX(-50%) !important;
  z-index: 32 !important;
}

/* 랭킹 — final EOF exact lock */
.ranking {
  position: relative !important;
  width: 375px !important;
  max-width: 100% !important;
  min-height: 812px !important;
  height: 812px !important;
  margin: 0 auto !important;
  background: #0068b7 !important;
  overflow: hidden !important;
}

.ranking::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3E%3Cg fill='%23ffffff' fill-opacity='0.2'%3E%3Ccircle cx='15' cy='7.5' r='4'/%3E%3Ccircle cx='7.5' cy='15' r='4'/%3E%3Ccircle cx='22.5' cy='15' r='4'/%3E%3Ccircle cx='15' cy='22.5' r='4'/%3E%3Ccircle cx='15' cy='15' r='1.7'/%3E%3C/g%3E%3C/svg%3E") !important;
  background-repeat: repeat !important;
  background-size: 30px 30px !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

.ranking .topbar {
  position: absolute !important;
  top: calc(var(--safe-top) + 34px) !important;
  left: 50% !important;
  width: 344px !important;
  transform: translateX(-50%) !important;
  z-index: 4 !important;
}

.ranking__hero {
  position: absolute !important;
  inset: 0 0 auto 0 !important;
  height: 452px !important;
  z-index: 2 !important;
}

.ranking__back {
  position: absolute !important;
  left: 0 !important;
  top: 387px !important;
  z-index: 4 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 24px !important;
  height: 38px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.ranking__back img {
  display: block !important;
  width: 13px !important;
  height: 24px !important;
}

.ranking-podium {
  position: absolute !important;
  width: 109px !important;
  height: 152px !important;
  margin: 0 !important;
  text-align: initial !important;
}

.ranking-podium--primary {
  top: 157px !important;
  left: 133px !important;
}

.ranking-podium--secondary {
  top: 215px !important;
  left: 16px !important;
}

.ranking-podium--tertiary {
  top: 246px !important;
  left: 250px !important;
}

.ranking-podium__plate {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 109px !important;
  height: 152px !important;
  margin: 0 !important;
}

.ranking-podium__copy {
  position: absolute !important;
  top: 12px !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 2 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 4px !important;
  text-align: center !important;
  white-space: nowrap !important;
}

.ranking-podium--tertiary .ranking-podium__copy {
  top: 14px !important;
}

.ranking-podium__copy strong {
  margin: 0 !important;
  color: #2a2a2b !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  line-height: 30px !important;
  letter-spacing: -0.96px !important;
}

.ranking-podium__copy span,
.ranking-podium__copy em {
  margin: 0 !important;
  color: #2a2a2b !important;
  font-size: 12px !important;
  font-style: normal !important;
  font-weight: 500 !important;
  line-height: 16px !important;
  letter-spacing: 0 !important;
}

.ranking-podium__copy span b,
.ranking-podium__copy em b {
  color: #0068b7 !important;
  font-weight: 500 !important;
}

.ranking-podium__medal {
  position: absolute !important;
  display: block !important;
  z-index: 3 !important;
  margin: 0 !important;
}

.ranking-podium--primary .ranking-podium__medal {
  top: 91px !important;
  left: 33px !important;
  width: 43px !important;
  height: 61px !important;
}

.ranking-podium--secondary .ranking-podium__medal {
  top: 90px !important;
  left: 32px !important;
  width: 44px !important;
  height: 62px !important;
}

.ranking-podium--tertiary .ranking-podium__medal {
  top: 99px !important;
  left: 33px !important;
  width: 43px !important;
  height: 61px !important;
}

.ranking__sheet {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 375px !important;
  height: 360px !important;
  margin: 0 auto !important;
  padding: 29px 16px 48px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 12px !important;
  background: #ffffff !important;
  border-radius: 32px 32px 0 0 !important;
  z-index: 1 !important;
}

.ranking-row {
  display: grid !important;
  grid-template-columns: 20px 30px minmax(0, 1fr) auto !important;
  align-items: center !important;
  column-gap: 8px !important;
  width: 343px !important;
  min-height: 21px !important;
  margin: 0 !important;
}

.ranking-row + .ranking-row {
  margin-top: 0 !important;
}

.ranking-row__rank,
.ranking-row__name,
.ranking-row__points {
  color: #2a2a2b !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 21px !important;
  letter-spacing: -0.32px !important;
}

.ranking-row__rank {
  width: 20px !important;
  text-align: left !important;
}

.ranking-row__team {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
}

.ranking-row__team img {
  display: block !important;
  width: 30px !important;
  height: 30px !important;
  object-fit: contain !important;
}

.ranking-row__name {
  min-width: 0 !important;
  white-space: nowrap !important;
}

.ranking-row__points {
  text-align: right !important;
}

.ranking-row__points strong {
  color: #0068b7 !important;
  font-weight: 500 !important;
}

.ranking__pager {
  position: absolute !important;
  left: 50% !important;
  bottom: 30px !important;
  width: 68px !important;
  height: 8px !important;
  transform: translateX(-50%) !important;
  display: block !important;
  filter: drop-shadow(0 0 8px rgba(0, 0, 0, 0.5)) !important;
}

/* 포지션 완료 — EOF exact final lock */
.lineup-screen--success .lineup-slot,
.lineup-screen--success .lineup-badge {
  display: none !important;
}

.lineup-screen--success .modal-backdrop {
  position: fixed !important;
  inset: 0 !important;
  display: grid !important;
  place-items: center !important;
  padding: 0 !important;
  background: rgba(0, 0, 0, 0.5) !important;
  z-index: 40 !important;
}

.lineup-screen--success .modal-card--lineup-success {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  width: 285px !important;
  max-width: 285px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25) !important;
  overflow: hidden !important;
  isolation: isolate !important;
  z-index: 41 !important;
}

.lineup-screen--success .modal-card__body--lineup-success {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  width: 100% !important;
  padding: 36px 24px 20px !important;
  gap: 20px !important;
  background: #ffffff !important;
}

.lineup-screen--success .modal-card__body--lineup-success::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: #ffffff !important;
  z-index: 0 !important;
}

.lineup-screen--success .modal-card__success-copy {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  width: 100% !important;
  gap: 4px !important;
  z-index: 1 !important;
}

.lineup-screen--success .modal-card__eyebrow {
  margin: 0 !important;
  color: #2a2a2b !important;
  font-size: 14px !important;
  font-weight: 300 !important;
  line-height: 20px !important;
  letter-spacing: -0.56px !important;
  text-align: center !important;
}

.lineup-screen--success .modal-card__title {
  margin: 0 !important;
  color: #2a2a2b !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 21px !important;
  letter-spacing: -0.32px !important;
  text-align: center !important;
}

.lineup-screen--success .modal-card__caption--neutral {
  position: relative !important;
  margin: 0 !important;
  color: #8c8c8c !important;
  font-size: 14px !important;
  font-weight: 300 !important;
  line-height: 20px !important;
  letter-spacing: -0.56px !important;
  text-align: center !important;
  z-index: 1 !important;
}

.lineup-screen--success .modal-card__footer--single {
  position: relative !important;
  width: 100% !important;
  height: 52px !important;
  min-height: 52px !important;
  flex: 0 0 52px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #0068b7 !important;
  border-radius: 0 0 8px 8px !important;
  overflow: hidden !important;
}

.lineup-screen--success .modal-card__footer--single::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: #0068b7 !important;
  z-index: 0 !important;
}

.lineup-screen--success .modal-card__single,
.lineup-screen--success .modal-card__single--primary {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 52px !important;
  min-height: 52px !important;
  flex: 0 0 52px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #ffffff !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 21px !important;
  letter-spacing: -0.32px !important;
  box-shadow: none !important;
  z-index: 1 !important;
}

/* 랭킹 — EOF exact lock */
.ranking {
  position: relative !important;
  width: 375px !important;
  height: 812px !important;
  min-height: 812px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  background: #0068b7 !important;
  overflow: hidden !important;
}

.ranking::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: url('../mcp/exact/collection/pattern-tile.png?v=20260415-1') !important;
  background-repeat: repeat !important;
  background-size: 30px 30px !important;
  opacity: 0.2 !important;
  pointer-events: none !important;
}

.ranking .topbar,
.ranking .topbar.is-dark {
  position: absolute !important;
  top: calc(var(--safe-top) + 34px) !important;
  left: 50% !important;
  width: 344px !important;
  height: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: translateX(-50%) !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  z-index: 4 !important;
}

.ranking .topbar__button,
.ranking .topbar__slot {
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  min-height: 24px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.ranking .topbar__brand,
.ranking .topbar__brand-lockup {
  width: 132px !important;
  height: 20px !important;
}

.ranking .topbar__brand-image {
  width: 132px !important;
  height: 20px !important;
  object-fit: contain !important;
}

.ranking__hero {
  position: absolute !important;
  inset: 0 auto auto 0 !important;
  width: 375px !important;
  height: 452px !important;
  margin: 0 !important;
  z-index: 2 !important;
}

.ranking__back {
  position: absolute !important;
  top: 387px !important;
  left: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 24px !important;
  height: 38px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  z-index: 3 !important;
}

.ranking__back img {
  display: block !important;
  width: 13.0833px !important;
  height: 24.1667px !important;
  margin: 0 !important;
}

.ranking-podium {
  position: absolute !important;
  display: block !important;
  width: 109px !important;
  height: 152px !important;
  margin: 0 !important;
  text-align: center !important;
}

.ranking-podium--primary {
  top: 157px !important;
  left: 133px !important;
}

.ranking-podium--secondary {
  top: 215px !important;
  left: 16px !important;
}

.ranking-podium--tertiary {
  top: 246px !important;
  left: 250px !important;
}

.ranking-podium__plate {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 109px !important;
  height: 152px !important;
  margin: 0 !important;
  object-fit: contain !important;
}

.ranking-podium__copy {
  position: absolute !important;
  top: 12px !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 2 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 4px !important;
  margin: 0 !important;
  text-align: center !important;
  white-space: nowrap !important;
}

.ranking-podium__copy strong {
  margin: 0 !important;
  color: #2a2a2b !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  line-height: 30px !important;
  letter-spacing: -0.96px !important;
}

.ranking-podium__copy span,
.ranking-podium__copy em {
  margin: 0 !important;
  color: #2a2a2b !important;
  font-size: 12px !important;
  font-style: normal !important;
  font-weight: 500 !important;
  line-height: 16px !important;
  letter-spacing: 0 !important;
}

.ranking-podium__copy span b,
.ranking-podium__copy em b {
  color: #0068b7 !important;
  font-weight: 500 !important;
}

.ranking-podium__medal {
  position: absolute !important;
  display: block !important;
  margin: 0 !important;
  z-index: 3 !important;
}

.ranking-podium--primary .ranking-podium__medal {
  top: 91px !important;
  left: 33px !important;
  width: 43px !important;
  height: 61px !important;
}

.ranking-podium--secondary .ranking-podium__medal {
  top: 90px !important;
  left: 32px !important;
  width: 44px !important;
  height: 62px !important;
}

.ranking-podium--tertiary .ranking-podium__medal {
  top: 99px !important;
  left: 33px !important;
  width: 43px !important;
  height: 61px !important;
}

.ranking__sheet {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 375px !important;
  height: 360px !important;
  margin: 0 auto !important;
  padding: 29px 16px 30px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 12px !important;
  background: #ffffff !important;
  border-radius: 32px 32px 0 0 !important;
  z-index: 1 !important;
}

.ranking-row {
  display: grid !important;
  grid-template-columns: 20px 30px minmax(0, 1fr) auto !important;
  align-items: center !important;
  column-gap: 8px !important;
  width: 343px !important;
  min-height: 21px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.ranking-row + .ranking-row {
  margin-top: 0 !important;
}

.ranking-row__rank,
.ranking-row__name,
.ranking-row__points {
  margin: 0 !important;
  color: #2a2a2b !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 21px !important;
  letter-spacing: -0.32px !important;
}

.ranking-row__rank {
  width: 20px !important;
  text-align: left !important;
}

.ranking-row__team {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
}

.ranking-row__team img {
  display: block !important;
  width: 30px !important;
  height: 30px !important;
  object-fit: contain !important;
}

.ranking-row__name {
  min-width: 0 !important;
  white-space: nowrap !important;
}

.ranking-row__points {
  text-align: right !important;
}

.ranking-row__points strong {
  color: #0068b7 !important;
  font-weight: 500 !important;
}

.ranking__pager {
  position: absolute !important;
  left: 50% !important;
  bottom: 30px !important;
  display: block !important;
  width: 68px !important;
  height: 8px !important;
  margin: 0 !important;
  transform: translateX(-50%) !important;
  filter: drop-shadow(0 0 8px rgba(0, 0, 0, 0.5)) !important;
}

/* 경험 공유 상세 — EOF exact lock */
.community-screen--detail {
  position: relative !important;
  width: 375px !important;
  max-width: 100% !important;
  min-height: 812px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  background: #ffffff !important;
  overflow: hidden !important;
}

.community-screen--detail .topbar {
  position: absolute !important;
  top: calc(var(--safe-top) + 34px) !important;
  left: 50% !important;
  width: 344px !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: translateX(-50%) !important;
  z-index: 4 !important;
}

.community-screen--detail .community-screen__body {
  position: relative !important;
  width: 375px !important;
  min-height: 812px !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

.community-screen--detail .page-title {
  position: absolute !important;
  top: 92px !important;
  left: 32px !important;
  width: 311px !important;
  margin: 0 !important;
  text-align: center !important;
}

.community-screen--detail .community-screen__lead {
  position: absolute !important;
  top: 130px !important;
  left: 81px !important;
  width: 212px !important;
  margin: 0 !important;
  text-align: center !important;
}

.community-screen--detail .community-card--detail {
  position: absolute !important;
  top: 220px !important;
  left: 12px !important;
  display: flex !important;
  flex-direction: column !important;
  width: 351px !important;
  height: 418px !important;
  min-height: 418px !important;
  margin: 0 !important;
  padding: 20px 8px !important;
  gap: 22px !important;
  box-sizing: border-box !important;
  border: 2px solid #0068b7 !important;
  border-radius: 8px !important;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.25) !important;
  background: #ffffff !important;
  overflow: hidden !important;
}

.community-screen--detail .community-card__head,
.community-screen--detail .community-card__footer {
  width: 334px !important;
  margin: 0 auto !important;
}

.community-screen--detail .community-card__head {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
}

.community-screen--detail .community-card__title-row {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.community-screen--detail .community-card__title-row strong {
  margin: 0 !important;
  color: #2a2a2b !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 21px !important;
  letter-spacing: -0.32px !important;
}

.community-screen--detail .community-card__title-row span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 24px !important;
  padding: 4px 8px !important;
  border-radius: 8px !important;
  background: #e3e3e3 !important;
  color: #8c8c8c !important;
  font-size: 12px !important;
  font-weight: 300 !important;
  line-height: 16px !important;
  letter-spacing: -0.24px !important;
}

.community-screen--detail .community-card__close {
  width: 24px !important;
  height: 24px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.community-screen--detail .community-card__close img {
  display: block !important;
  width: 24px !important;
  height: 24px !important;
}

.community-screen--detail .community-card__photo {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 334px !important;
  height: 286px !important;
  margin: 0 auto !important;
  border-radius: 8px !important;
  background: rgba(0, 104, 183, 0.4) !important;
}

.community-screen--detail .community-card__photo > .community-placeholder,
.community-screen--detail .community-card__photo-icon,
.community-screen--detail .community-placeholder__asset {
  width: 32px !important;
  height: 32px !important;
}

.community-screen--detail .community-card__footer {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  gap: 8px !important;
}

.community-screen--detail .community-card__footer p {
  max-width: 238px !important;
  margin: 0 !important;
  color: #2a2a2b !important;
  font-size: 14px !important;
  font-weight: 300 !important;
  line-height: 20px !important;
  letter-spacing: -0.56px !important;
}

.community-screen--detail .community-card__footer .community-emoji {
  font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif !important;
}

.community-screen--detail .community-card__like {
  display: inline-flex !important;
  align-items: flex-end !important;
  justify-content: flex-end !important;
  min-width: 76px !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 6px !important;
  border: 0 !important;
  background: transparent !important;
}

.community-screen--detail .community-card__like span {
  color: #2a2a2b !important;
  font-size: 14px !important;
  font-weight: 300 !important;
  line-height: 20px !important;
  letter-spacing: -0.56px !important;
  white-space: nowrap !important;
}

.community-screen--detail .community-card__heart,
.community-screen--detail .community-card__heart img {
  width: 26px !important;
  height: 23.28px !important;
  object-fit: contain !important;
}

.community-screen--detail .screen__footer--community {
  position: absolute !important;
  top: 650px !important;
  left: 45px !important;
  width: 285px !important;
  height: 52px !important;
  margin: 0 !important;
  padding: 0 !important;
  z-index: 3 !important;
}

.community-screen--detail .screen__footer--community .cta {
  width: 285px !important;
  height: 52px !important;
  min-height: 52px !important;
  margin: 0 !important;
}

.community-screen--detail .community-screen__notice {
  position: absolute !important;
  top: 716px !important;
  left: 45px !important;
  width: 285px !important;
  margin: 0 !important;
  transform: none !important;
  color: #ff0000 !important;
  font-size: 12px !important;
  font-weight: 300 !important;
  line-height: 16px !important;
  letter-spacing: -0.24px !important;
  text-align: center !important;
}

/* 포지션 완료 — success field overlay cleanup */
.lineup-screen--success .lineup-slot,
.lineup-screen--success .lineup-badge {
  display: none !important;
}

/* 랭킹 — EOF exact lock (Figma 198:4260) */
.ranking {
  position: relative !important;
  min-height: var(--device-height) !important;
  background: #0068b7 !important;
  overflow: hidden !important;
}

.ranking::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: url('../mcp/exact/collection/pattern-tile.png?v=20260415-1') !important;
  background-repeat: repeat !important;
  background-size: 30px 30px !important;
  opacity: 0.2 !important;
  pointer-events: none !important;
}

.ranking .topbar {
  position: absolute !important;
  top: calc(var(--safe-top) + 34px) !important;
  left: 50% !important;
  width: 344px !important;
  transform: translateX(-50%) !important;
  z-index: 5 !important;
}

.ranking__hero {
  position: absolute !important;
  inset: 0 0 auto 0 !important;
  height: 452px !important;
  z-index: 3 !important;
}

.ranking__back {
  position: absolute !important;
  top: 387px !important;
  left: 0 !important;
  width: 24px !important;
  height: 38px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
  z-index: 4 !important;
}

.ranking__back img {
  display: block !important;
  width: 13.0833px !important;
  height: 24px !important;
  margin: 0 auto !important;
}

.ranking-podium {
  position: absolute !important;
  width: 109px !important;
  height: 152px !important;
  text-align: center !important;
}

.ranking-podium--primary {
  top: 157px !important;
  left: 133px !important;
}

.ranking-podium--secondary {
  top: 215px !important;
  left: 16px !important;
}

.ranking-podium--tertiary {
  top: 246px !important;
  left: 250px !important;
}

.ranking-podium__plate {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 109px !important;
  height: 152px !important;
  margin: 0 !important;
}

.ranking-podium__copy {
  position: absolute !important;
  top: 12px !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 2 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 4px !important;
  text-align: center !important;
  white-space: nowrap !important;
}

.ranking-podium__copy strong {
  margin: 0 !important;
  color: #2a2a2b !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  line-height: 30px !important;
  letter-spacing: -0.96px !important;
}

.ranking-podium__copy span,
.ranking-podium__copy em {
  margin: 0 !important;
  color: #2a2a2b !important;
  font-size: 12px !important;
  font-style: normal !important;
  font-weight: 500 !important;
  line-height: 16px !important;
  letter-spacing: 0 !important;
}

.ranking-podium__copy span b,
.ranking-podium__copy em b {
  color: #0068b7 !important;
  font-weight: 500 !important;
}

.ranking-podium__medal {
  position: absolute !important;
  display: block !important;
  z-index: 3 !important;
}

.ranking-podium--primary .ranking-podium__medal {
  top: 91px !important;
  left: 33px !important;
  width: 43px !important;
  height: 61px !important;
}

.ranking-podium--secondary .ranking-podium__medal {
  top: 90px !important;
  left: 32px !important;
  width: 44px !important;
  height: 62px !important;
}

.ranking-podium--tertiary .ranking-podium__medal {
  top: 99px !important;
  left: 33px !important;
  width: 43px !important;
  height: 61px !important;
}

.ranking__sheet {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 375px !important;
  height: 360px !important;
  margin: 0 auto !important;
  padding: 29px 16px 48px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 12px !important;
  background: #fff !important;
  border-radius: 32px 32px 0 0 !important;
  z-index: 2 !important;
}

.ranking-row {
  display: grid !important;
  grid-template-columns: 20px 30px minmax(0, 1fr) auto !important;
  align-items: center !important;
  column-gap: 8px !important;
  width: 343px !important;
  min-height: 21px !important;
  margin: 0 !important;
}

.ranking-row + .ranking-row {
  margin-top: 0 !important;
}

.ranking-row__rank,
.ranking-row__name,
.ranking-row__points {
  color: #2a2a2b !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 21px !important;
  letter-spacing: -0.32px !important;
}

.ranking-row__rank {
  width: 20px !important;
  text-align: left !important;
}

.ranking-row__team {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
}

.ranking-row__team img {
  display: block !important;
  width: 30px !important;
  height: 30px !important;
  object-fit: contain !important;
}

.ranking-row__name {
  min-width: 0 !important;
  white-space: nowrap !important;
}

.ranking-row__points {
  text-align: right !important;
}

.ranking-row__points strong {
  color: #0068b7 !important;
  font-weight: 500 !important;
}

.ranking__pager {
  position: absolute !important;
  left: 50% !important;
  bottom: 30px !important;
  width: 68px !important;
  height: 8px !important;
  transform: translateX(-50%) !important;
  display: block !important;
  filter: drop-shadow(0 0 8px rgba(0, 0, 0, 0.5)) !important;
}

/* 포지션 완료 — final last-wins lock */
.lineup-screen--success .modal-backdrop {
  position: fixed !important;
  inset: 0 !important;
  display: grid !important;
  place-items: center !important;
  padding: 0 !important;
  background: rgba(0, 0, 0, 0.5) !important;
  z-index: 40 !important;
}

.lineup-screen--success .modal-card--lineup-success {
  display: flex !important;
  flex-direction: column !important;
  position: relative !important;
  width: 285px !important;
  max-width: 285px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25) !important;
  overflow: hidden !important;
  opacity: 1 !important;
  isolation: isolate !important;
  z-index: 41 !important;
}

.lineup-screen--success .modal-card__body--lineup-success {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  width: 100% !important;
  padding: 36px 24px 20px !important;
  gap: 20px !important;
  background: #ffffff !important;
  opacity: 1 !important;
}

.lineup-screen--success .modal-card__body--lineup-success::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: #ffffff !important;
  z-index: 0 !important;
}

.lineup-screen--success .modal-card__success-copy {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 4px !important;
  width: 100% !important;
  z-index: 1 !important;
}

.lineup-screen--success .modal-card__eyebrow {
  margin: 0 !important;
  color: #2a2a2b !important;
  font-size: 14px !important;
  font-weight: 300 !important;
  line-height: 20px !important;
  letter-spacing: -0.56px !important;
  text-align: center !important;
}

.lineup-screen--success .modal-card__title {
  margin: 0 !important;
  color: #2a2a2b !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 21px !important;
  letter-spacing: -0.32px !important;
  text-align: center !important;
}

.lineup-screen--success .modal-card__caption--neutral {
  position: relative !important;
  margin: 0 !important;
  color: #8c8c8c !important;
  font-size: 14px !important;
  font-weight: 300 !important;
  line-height: 20px !important;
  letter-spacing: -0.56px !important;
  text-align: center !important;
  z-index: 1 !important;
}

.lineup-screen--success .modal-card__footer--single {
  position: relative !important;
  width: 100% !important;
  height: 52px !important;
  min-height: 52px !important;
  flex: 0 0 52px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #0068b7 !important;
  border-radius: 0 0 8px 8px !important;
  overflow: hidden !important;
  opacity: 1 !important;
}

.lineup-screen--success .modal-card__footer--single::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: #0068b7 !important;
  z-index: 0 !important;
}

.lineup-screen--success .modal-card__single,
.lineup-screen--success .modal-card__single--primary {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 52px !important;
  min-height: 52px !important;
  flex: 0 0 52px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #0068b7 !important;
  color: #ffffff !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 21px !important;
  letter-spacing: -0.32px !important;
  opacity: 1 !important;
  box-shadow: none !important;
  z-index: 1 !important;
}

/* 선발 포지션 완료 — EOF exact lock */
.lineup-screen--success .modal-backdrop {
  position: absolute !important;
  inset: 0 !important;
  z-index: 15 !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  padding-top: 279px !important;
  background: rgba(0, 0, 0, 0.5) !important;
}

.modal-card--lineup-success {
  width: 285px !important;
  background: #fff !important;
  background-color: #fff !important;
  background-image: none !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25) !important;
  opacity: 1 !important;
  filter: none !important;
  backdrop-filter: none !important;
  mix-blend-mode: normal !important;
  isolation: isolate !important;
}

.modal-card--lineup-success .modal-card__body--lineup-success {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 20px !important;
  width: 100% !important;
  padding: 36px 0 20px !important;
  background: #fff !important;
  background-color: #fff !important;
  background-image: none !important;
  opacity: 1 !important;
  filter: none !important;
}

.modal-card--lineup-success .modal-card__success-copy {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 4px !important;
}

.modal-card--lineup-success .modal-card__eyebrow {
  margin: 0 !important;
  color: #2a2a2b !important;
  font-size: 14px !important;
  font-weight: 300 !important;
  line-height: 20px !important;
  letter-spacing: -0.56px !important;
  text-align: center !important;
}

.modal-card--lineup-success .modal-card__title {
  margin: 0 !important;
  color: #2a2a2b !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 21px !important;
  letter-spacing: -0.32px !important;
  text-align: center !important;
}

.modal-card--lineup-success .modal-card__caption--neutral {
  margin: 0 !important;
  color: #8c8c8c !important;
  font-size: 14px !important;
  font-weight: 300 !important;
  line-height: 20px !important;
  letter-spacing: -0.56px !important;
  text-align: center !important;
}

.modal-card--lineup-success .modal-card__footer--single {
  width: 285px !important;
  min-height: 52px !important;
  background: #0068b7 !important;
  background-color: #0068b7 !important;
  background-image: none !important;
  border-radius: 0 0 8px 8px !important;
  overflow: hidden !important;
  opacity: 1 !important;
  filter: none !important;
}

.modal-card--lineup-success .modal-card__single {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 52px !important;
  min-height: 52px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #fff !important;
  border-radius: 0 !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 21px !important;
  letter-spacing: -0.32px !important;
}

/* 포지션 완료 — EOF exact lock */
.lineup-screen--success .modal-backdrop {
  position: absolute !important;
  inset: 0 !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  padding-top: 279px !important;
  background: rgba(0, 0, 0, 0.5) !important;
  z-index: 15 !important;
}

.lineup-screen--success .modal-card--lineup-success {
  width: 285px !important;
  max-width: 285px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
  opacity: 1 !important;
  filter: none !important;
  backdrop-filter: none !important;
  box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25) !important;
  overflow: hidden !important;
}

.lineup-screen--success .modal-card__body--lineup-success {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 20px !important;
  width: 100% !important;
  padding: 36px 24px 20px !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
  opacity: 1 !important;
  filter: none !important;
}

.lineup-screen--success .modal-card__success-copy {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 4px !important;
  width: 100% !important;
}

.lineup-screen--success .modal-card__eyebrow {
  margin: 0 !important;
  color: #2a2a2b !important;
  font-size: 14px !important;
  font-weight: 300 !important;
  line-height: 20px !important;
  letter-spacing: -0.56px !important;
  text-align: center !important;
}

.lineup-screen--success .modal-card__title {
  margin: 0 !important;
  color: #2a2a2b !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 21px !important;
  letter-spacing: -0.32px !important;
  text-align: center !important;
}

.lineup-screen--success .modal-card__caption--neutral {
  margin: 0 !important;
  color: #8c8c8c !important;
  font-size: 14px !important;
  font-weight: 300 !important;
  line-height: 20px !important;
  letter-spacing: -0.56px !important;
  text-align: center !important;
}

.lineup-screen--success .modal-card__footer--single {
  width: 285px !important;
  min-height: 52px !important;
  height: 52px !important;
  flex: 0 0 52px !important;
  margin: 0 !important;
  background: #0068b7 !important;
  border-radius: 0 0 8px 8px !important;
  overflow: hidden !important;
}

.lineup-screen--success .modal-card__single,
.lineup-screen--success .modal-card__single--primary {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 52px !important;
  min-height: 52px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #0068b7 !important;
  color: #ffffff !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 21px !important;
  letter-spacing: -0.32px !important;
  box-shadow: none !important;
}

/* 경험 공유 목록 — EOF exact lock */
.community-screen--feed {
  position: relative !important;
  width: 375px !important;
  max-width: 100% !important;
  min-height: 812px !important;
  margin: 0 auto !important;
  overflow: hidden !important;
}

.community-screen--feed .topbar {
  top: calc(var(--safe-top) + 18px) !important;
  left: 50% !important;
  width: 344px !important;
  transform: translateX(-50%) !important;
  z-index: 4 !important;
}

.community-screen--feed .community-screen__body {
  position: relative !important;
  width: 375px !important;
  min-height: 812px !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

.community-screen--feed .page-title {
  position: absolute !important;
  top: 92px !important;
  left: 32px !important;
  width: 311px !important;
  margin: 0 !important;
  text-align: center !important;
}

.community-screen--feed .community-screen__lead {
  position: absolute !important;
  top: 130px !important;
  left: 81px !important;
  width: 212px !important;
  margin: 0 !important;
  text-align: center !important;
}

.community-screen--feed .community-grid--figma {
  position: absolute !important;
  top: 202px !important;
  left: 16px !important;
  width: 343px !important;
  display: grid !important;
  grid-template-columns: 168px 168px !important;
  grid-auto-rows: 206px !important;
  gap: 6px 7px !important;
  margin: 0 !important;
}

.community-screen--feed .community-tile--figma {
  width: 168px !important;
  height: 206px !important;
  padding: 8px !important;
  gap: 4px !important;
  border: 1.5px solid #0068b7 !important;
  border-radius: 8px !important;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.25) !important;
  background: #ffffff !important;
}

.community-screen--feed .community-tile__photo {
  height: 96px !important;
  border-radius: 8px !important;
  background: rgba(0, 104, 183, 0.4) !important;
}

.community-screen--feed .community-card__photo-icon,
.community-screen--feed .community-placeholder {
  width: 32px !important;
  height: 32px !important;
}

.community-screen--feed .community-tile__meta {
  min-height: 20px !important;
}

.community-screen--feed .community-tile__meta span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 24px !important;
  padding: 4px 8px !important;
  border-radius: 8px !important;
  background: #e3e3e3 !important;
  color: #8c8c8c !important;
  font-size: 12px !important;
  font-weight: 300 !important;
  line-height: 16px !important;
  letter-spacing: -0.24px !important;
}

.community-screen--feed .community-tile__like {
  width: 16px !important;
  height: 16px !important;
  padding: 0 !important;
}

.community-screen--feed .community-tile__heart,
.community-screen--feed .community-tile__heart img {
  width: 16.7px !important;
  height: 15px !important;
  object-fit: contain !important;
}

.community-screen--feed .community-tile strong {
  display: block !important;
  width: 100% !important;
  min-height: 21px !important;
  color: #2a2a2b !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  line-height: 21px !important;
  letter-spacing: -0.3px !important;
  white-space: nowrap !important;
}

.community-screen--feed .community-tile__button {
  width: 100% !important;
  min-height: 40px !important;
  padding: 8px 0 !important;
  border-radius: 8px !important;
  background: #0068b7 !important;
  color: #ffffff !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 21px !important;
  letter-spacing: -0.32px !important;
}

.community-screen--feed .screen__footer--community {
  position: absolute !important;
  top: 646px !important;
  left: 45px !important;
  width: 285px !important;
  height: 52px !important;
  margin: 0 !important;
  padding: 0 !important;
  z-index: 3 !important;
}

.community-screen--feed .screen__footer--community .cta {
  width: 285px !important;
  height: 52px !important;
  min-height: 52px !important;
  margin: 0 !important;
}

.community-screen--feed .community-screen__notice {
  position: absolute !important;
  top: 712px !important;
  left: 45px !important;
  width: 285px !important;
  margin: 0 !important;
  transform: none !important;
  color: #ff0000 !important;
  font-size: 12px !important;
  font-weight: 300 !important;
  line-height: 16px !important;
  letter-spacing: -0.24px !important;
  text-align: center !important;
}

/* 승/패 예측 완료 — EOF exact lock */
.predict-screen--blocked {
  position: relative !important;
  overflow: hidden !important;
  height: 812px !important;
  min-height: 812px !important;
}

.predict-screen--blocked .screen__body {
  position: relative !important;
  width: 375px !important;
  min-height: 812px !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.predict-screen--blocked .predict--figma {
  position: relative !important;
  width: 375px !important;
  min-height: 812px !important;
  padding: 0 !important;
}

.predict-screen--blocked .hero-copy {
  position: absolute !important;
  top: 136px !important;
  left: 54px !important;
  width: 266px !important;
  margin: 0 !important;
}

.predict-screen--blocked .page-title {
  width: 108px !important;
  margin: 0 auto !important;
}

.predict-screen--blocked .predict-copy {
  width: 266px !important;
  margin: 0 auto !important;
}

.predict-screen--blocked .predict-meta {
  position: absolute !important;
  top: 236px !important;
  left: 16px !important;
  width: 343px !important;
  margin: 0 !important;
}

.predict-screen--blocked .predict-meta__note {
  width: 116px !important;
}

.predict-screen--blocked .predict-board {
  position: absolute !important;
  top: 268px !important;
  left: 16px !important;
  width: 343px !important;
  height: 532px !important;
  max-height: 532px !important;
  margin: 0 !important;
  border-radius: 8px 8px 0 0 !important;
  background: #333 !important;
  overflow: hidden !important;
}

.predict-screen--blocked .predict-list {
  height: 532px !important;
  max-height: 532px !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.predict-screen--blocked .predict-card {
  padding: 16px 0 0 !important;
}

.predict-screen--blocked .predict-card__head,
.predict-screen--blocked .predict-row,
.predict-screen--blocked .predict-locked-card,
.predict-screen--blocked .predict-history-row {
  width: 285px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.predict-screen--blocked .predict-history-row {
  min-height: 53px !important;
  padding: 0 !important;
}

.predict-screen--blocked .predict-card__badge,
.predict-screen--blocked .predict-history-row__badge {
  min-width: 82px !important;
  height: 29px !important;
  padding: 0 10px !important;
  font-size: 16px !important;
  line-height: 21px !important;
}

.predict-screen--blocked .predict-history-row__badge--success {
  background: #2f70ff !important;
}

.predict-screen--blocked .predict-history-row__badge--failure {
  background: #ff5b63 !important;
}

.predict-screen--blocked .predict-history-row__chevron::before {
  transform: rotate(45deg) !important;
}

.predict-screen--blocked .predict-card.is-complete .predict-card__badge {
  background: #1ac5ff !important;
}

.predict-screen--blocked .screen__footer {
  position: absolute !important;
  top: 658px !important;
  left: 45px !important;
  right: auto !important;
  bottom: auto !important;
  width: 285px !important;
  height: 52px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  background: none !important;
  overflow: visible !important;
  z-index: 7 !important;
}

.predict-screen--blocked .screen__footer::before {
  content: "" !important;
  position: absolute !important;
  top: -56px !important;
  left: -29px !important;
  width: 343px !important;
  height: 186px !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.24) 22%, rgba(255, 255, 255, 0.78) 58%, #fff 84%) !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

.predict-screen--blocked .screen__footer .cta {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 285px !important;
  height: 52px !important;
  min-height: 52px !important;
  margin: 0 !important;
  z-index: 1 !important;
}

.predict-screen--blocked .predict-footer-note {
  position: absolute !important;
  top: 54px !important;
  left: 63px !important;
  width: 159px !important;
  margin: 0 !important;
  text-align: center !important;
  z-index: 7 !important;
}