/* Kariyer Köprüsü v23 — referans arayüz katmanı
   Yalnızca görünüm düzenlenir; mevcut React/oyun mantığı korunur. */

:root{
  --ui-green:#07653f;
  --ui-green-dark:#004f32;
  --ui-green-mid:#0b7b4b;
  --ui-mint:#eaf6ef;
  --ui-mint-2:#f5faf7;
  --ui-cream:#fff6dc;
  --ui-red:#a8433b;
  --ui-border:#dbe8df;
  --ui-text:#132119;
  --ui-muted:#69786f;
  --ui-shadow:0 14px 34px rgba(20,55,35,.09);
  --ui-shadow-soft:0 8px 20px rgba(20,55,35,.06);
}

html,body{background:#f3f7f4!important;color:var(--ui-text)!important}
body{overflow-x:hidden}
body::before,body::after{
  content:"";position:fixed;z-index:-1;pointer-events:none;opacity:.22;
  width:260px;height:260px;background:
    radial-gradient(circle at 20px 20px,#7cb895 0 2px,transparent 3px),
    linear-gradient(45deg,transparent 49%,#bcd8c8 50% 51%,transparent 52%);
  background-size:42px 42px,84px 84px;
}
body::before{left:-90px;top:120px;transform:rotate(8deg)}
body::after{right:-105px;bottom:-70px;transform:rotate(-15deg)}

/* Ağır görsel efektleri kapat: arayüz açıkken CPU/GPU yükü düşük kalır. */
.topbar,.round-team,.player-card,.surface{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
.setup-orbit,.setup-ball,.timer-ring,.live-pill{animation:none!important}
*{scrollbar-color:#9bc4ad #edf4ef}

.app-shell{
  width:min(1480px,calc(100% - 18px))!important;
  margin:10px auto 18px!important;
}
.surface{
  background:#fff!important;
  border:1px solid var(--ui-border)!important;
  box-shadow:var(--ui-shadow)!important;
}

/* Üst menü */
.topbar{
  min-height:66px!important;
  padding:9px 14px 9px 178px!important;
  border-radius:18px!important;
  position:sticky!important;
  top:8px!important;
  z-index:8000!important;
}
.brand{gap:14px!important}
.brand img{width:44px!important;height:44px!important}
.brand strong{font-size:20px!important;letter-spacing:-.035em!important}
.brand span{font-size:9px!important;letter-spacing:.20em!important;color:#668173!important}
.topnav button{
  min-height:46px!important;padding:0 18px!important;border-radius:14px!important;
  font-size:14px!important;background:linear-gradient(180deg,#0c7449,#005a38)!important;
  color:#fff!important;box-shadow:0 8px 18px rgba(0,91,57,.18)!important;
}
.portal-home-button{
  top:18px!important;
  left:max(18px,calc((100vw - 1480px)/2 + 18px))!important;
  height:46px!important;
  padding:0 16px!important;
  border-radius:14px!important;
  font-size:14px!important;
  background:linear-gradient(180deg,#0c7449,#005a38)!important;
  box-shadow:0 8px 18px rgba(0,91,57,.18)!important;
}
.portal-home-button svg{width:18px!important;height:18px!important}

/* Ana sayfa iskeleti */
.main-grid{
  grid-template-columns:minmax(0,1fr) 286px!important;
  gap:12px!important;
  margin-top:10px!important;
  align-items:start!important;
}
.hero,.footer,.section-title,.setup-showcase{display:none!important}
.game-card{
  grid-column:1!important;
  padding:0!important;
  border:0!important;
  box-shadow:none!important;
  background:transparent!important;
  overflow:visible!important;
}
.side-stack{grid-column:2!important;gap:10px!important}
.side-card{padding:16px!important;border-radius:20px!important}
.side-card__title>span{font-size:10px!important;letter-spacing:.15em!important;color:var(--ui-green)!important}
.side-card__title h3{font-size:17px!important;margin-top:6px!important}

/* Oyun modu: işlev korunur, ekranı işgal etmeyen kompakt görünüm */
.mode-switch--three{
  margin:0 0 12px!important;padding:6px!important;gap:6px!important;
  border:1px solid var(--ui-border)!important;border-radius:18px!important;
  background:#fff!important;box-shadow:var(--ui-shadow-soft)!important;
}
.mode-switch--three button{
  min-height:58px!important;padding:7px 12px!important;border-radius:13px!important;
  background:#f8fbf9!important;border:1px solid transparent!important;
}
.mode-switch--three button>span{width:36px!important;height:36px!important;border-radius:11px!important}
.mode-switch--three button b{font-size:11px!important}
.mode-switch--three button small{font-size:8px!important}
.mode-switch--three button.active{
  color:var(--ui-green)!important;background:#edf8f2!important;border-color:#a8d3ba!important;
  box-shadow:none!important;
}
.mode-switch--three button.active>span{background:var(--ui-green)!important;color:#fff!important}

.solo-settings,.online-setup,.online-room-bar,.selection-warning{
  margin:0 0 12px!important;border-radius:18px!important;
  border:1px solid var(--ui-border)!important;background:#fff!important;
  box-shadow:var(--ui-shadow-soft)!important;
}
.solo-settings{min-height:58px!important;padding:10px 14px!important}
.difficulty-tabs button,.setting-tabs button{
  border:1px solid #dce7e0!important;background:#fff!important;color:#26362d!important;
  box-shadow:0 2px 6px rgba(24,59,37,.04)!important;
}
.difficulty-tabs button.active,.setting-tabs button.active{
  background:linear-gradient(180deg,#0c7b4c,#05643e)!important;
  color:#fff!important;border-color:#05643e!important;
  box-shadow:0 8px 18px rgba(5,100,62,.18)!important;
}

/* Süre ve hedef kartları */
.match-settings{
  display:grid!important;grid-template-columns:1fr 1fr!important;gap:16px!important;
  margin:0 0 16px!important;padding:0!important;background:transparent!important;
  border:0!important;box-shadow:none!important;overflow:visible!important;
}
.match-settings::after{display:none!important}
.match-settings__group{
  min-height:162px!important;padding:22px 22px 18px 84px!important;
  border:1px solid var(--ui-border)!important;border-radius:24px!important;
  background:#fff!important;box-shadow:var(--ui-shadow)!important;
  position:relative!important;display:flex!important;flex-direction:column!important;justify-content:space-between!important;
}
.match-settings__group::before{
  content:"◷";position:absolute;left:22px;top:22px;width:48px;height:48px;
  display:grid;place-items:center;border-radius:16px;background:#e8f4ed;color:var(--ui-green);
  font-size:24px;font-weight:900;
}
.match-settings__group:nth-child(2)::before{content:"◎"}
.match-settings__group>div:first-child{display:flex!important;flex-direction:column!important;gap:8px!important}
.match-settings__group>div:first-child span{
  font-size:10px!important;letter-spacing:.16em!important;color:var(--ui-green)!important;font-weight:900!important;text-transform:uppercase!important;
}
.match-settings__group>div:first-child b{font-size:14px!important;color:#4d5c53!important}
.setting-tabs{
  display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:6px!important;
  padding:6px!important;margin-left:-62px!important;border:1px solid #e0e9e3!important;
  border-radius:16px!important;background:#f8faf9!important;
}
.setting-tabs button{height:44px!important;border-radius:12px!important;font-size:12px!important;font-weight:900!important}

/* Takım seçim alanı */
.players-grid{
  min-height:318px!important;display:grid!important;
  grid-template-columns:minmax(0,1fr) 74px minmax(0,1fr)!important;
  gap:12px!important;align-items:stretch!important;
  padding:10px!important;border:1px solid var(--ui-border)!important;border-radius:26px!important;
  background:linear-gradient(180deg,#fbfdfc,#f2f8f4)!important;
  box-shadow:var(--ui-shadow)!important;overflow:visible!important;
}
.players-grid::before,.players-grid::after{display:none!important}
.player-card{
  min-height:296px!important;padding:16px!important;border-radius:20px!important;
  border:1px solid #d4e4da!important;background:#fff!important;
  box-shadow:var(--ui-shadow-soft)!important;overflow:visible!important;
}
.player-card::before{
  height:5px!important;border-radius:22px 22px 0 0!important;
  background:linear-gradient(90deg,#07653f,#44c082,#a3e2bd)!important;
}
.player-card__head{margin:0 0 12px!important}
.player-label{font-size:13px!important;letter-spacing:.08em!important}
.player-dot{width:9px!important;height:9px!important}
.score-chip{padding:7px 8px 7px 11px!important;border-radius:12px!important;background:#f1f6f3!important}
.score-chip span{font-size:8px!important}
.score-chip strong{min-width:36px!important;height:36px!important;border-radius:10px!important;font-size:17px!important;background:var(--ui-green)!important}

.club-search{
  min-height:76px!important;padding:9px 12px!important;gap:12px!important;
  border:1px solid #c9ddd1!important;border-radius:18px!important;background:#fff!important;
  box-shadow:0 5px 16px rgba(24,59,37,.04)!important;
}
.club-search:focus-within{border-color:#3d9d69!important;box-shadow:0 0 0 4px rgba(33,136,82,.11)!important}
.club-search input{font-size:14px!important;font-weight:650!important}
.club-search .club-badge{flex:0 0 auto!important}
.search-icon{font-size:19px!important;padding-right:2px!important}
.search-menu{
  z-index:99999!important;top:calc(100% + 8px)!important;max-height:280px!important;
  padding:8px!important;border-radius:16px!important;box-shadow:0 22px 50px rgba(20,45,31,.18)!important;
}
.search-menu button{min-height:52px!important;grid-template-columns:42px 1fr auto!important;border-radius:12px!important}
.search-menu button b{font-size:12px!important}
.search-menu button small{font-size:9px!important}

.club-summary{grid-template-columns:1.25fr .8fr 1fr!important;gap:7px!important;margin-top:10px!important}
.club-summary>div{min-height:58px!important;padding:10px!important;border:1px solid #e3ebe6!important;border-radius:13px!important;background:#f8faf9!important}
.club-summary span,.role-card span{font-size:8px!important}
.club-summary b{font-size:10px!important}
.role-card{
  min-height:60px!important;margin-top:9px!important;padding:11px 13px!important;
  border-radius:14px!important;background:linear-gradient(135deg,#07653f,#11945a)!important;color:#fff!important;border:0!important;
}
.role-card span{color:#d3eee0!important}.role-card strong{font-size:12px!important}.role-code{color:#fff!important;background:#ffffff12!important;border-color:#ffffff35!important}

.versus{gap:10px!important;z-index:2!important}
.versus span{
  width:62px!important;height:62px!important;border-radius:50%!important;font-size:21px!important;
  border:7px solid #d8eee2!important;box-shadow:0 0 0 2px #2b9360,0 12px 28px rgba(20,93,60,.22)!important;
}
.versus small{font-size:9px!important;letter-spacing:.15em!important;color:#6c8075!important}

.game-actions{
  min-height:72px!important;margin-top:10px!important;padding:10px!important;
  display:flex!important;align-items:center!important;justify-content:center!important;gap:24px!important;
  border:1px solid var(--ui-border)!important;border-radius:22px!important;background:#fff!important;
  box-shadow:var(--ui-shadow)!important;z-index:1!important;
}
.game-actions .btn{min-height:50px!important;min-width:194px!important;border-radius:15px!important;font-size:14px!important}
.game-actions .btn--primary{background:linear-gradient(180deg,#0c7b4c,#05643e)!important}
.game-actions .btn--danger-soft{background:#fff0ed!important;color:#a23e35!important}

/* Sağ sütun */
.steps{margin-top:12px!important}.step{padding:10px 0!important}.step>span{width:38px!important;height:38px!important;border-radius:12px!important}.step b{font-size:11px!important}.step small{font-size:9px!important}
.data-grid{gap:10px!important;margin-top:15px!important}
.data-grid>div{min-height:76px!important;padding:12px!important;border-radius:14px!important;background:#f7faf8!important}
.data-grid span{width:32px!important;height:32px!important;border-radius:10px!important;font-size:17px!important}
.data-grid strong{font-size:18px!important}.data-grid small{font-size:9px!important}
.data-card>p{font-size:10px!important;margin-top:14px!important}
.history-list{margin-top:12px!important}.history-item{grid-template-columns:42px 1fr auto!important;gap:10px!important;padding:11px 0!important}.history-item>span{width:42px!important;height:42px!important;border-radius:12px!important}.history-item b{font-size:10px!important}.history-item small{font-size:8px!important}.history-item em{font-size:9px!important}
.empty-state{min-height:150px!important}

/* Oyun ekranı */
.round-arena{
  margin:0!important;padding:0!important;border-radius:26px!important;
  border:1px solid #cddfd4!important;background:#fff!important;box-shadow:var(--ui-shadow)!important;overflow:hidden!important;
}
.round-arena::before{opacity:.10!important;background-size:cover!important}
.round-arena::after{display:none!important}
.round-scoreboard,.round-arena .round-scoreboard{
  min-height:190px!important;padding:24px 34px!important;border-radius:25px 25px 0 0!important;
  grid-template-columns:minmax(0,1fr) 126px minmax(0,1fr)!important;gap:28px!important;
  background:linear-gradient(110deg,var(--left-team-accent),var(--left-team-secondary) 42%,#07543a 50%,var(--right-team-secondary) 58%,var(--right-team-accent))!important;
}
.round-scoreboard::before{opacity:.48!important}
.round-team{
  min-height:112px!important;padding:14px 18px!important;border-radius:20px!important;
  background:rgba(4,31,21,.34)!important;border:1px solid rgba(255,255,255,.34)!important;
  box-shadow:0 8px 20px rgba(0,0,0,.12)!important;
}
.round-team b{font-size:25px!important;line-height:1.12!important}.round-team span{font-size:12px!important;color:#f0fff6!important}
.round-team .club-badge--lg{width:78px!important;height:78px!important;border-radius:18px!important}
.timer-ring{
  width:118px!important;height:118px!important;border:8px solid rgba(255,255,255,.72)!important;
  background:linear-gradient(180deg,#0b7a4b,#035334)!important;
  box-shadow:0 0 0 4px rgba(42,208,125,.65),0 0 0 10px rgba(255,255,255,.38),0 14px 28px rgba(0,0,0,.22)!important;
}
.timer-ring strong{font-size:43px!important}.timer-ring span{font-size:10px!important;letter-spacing:.13em!important;color:#e7fff2!important}

.round-content,.round-arena .round-content{padding:24px 28px 28px!important}
.round-heading-row{align-items:center!important;margin-bottom:18px!important}
.round-kicker{padding:8px 13px!important;border-radius:999px!important;font-size:10px!important;letter-spacing:.14em!important;background:#e7f6ed!important;color:var(--ui-green)!important}
.round-heading-row h3{font-size:29px!important;margin-top:10px!important;letter-spacing:-.04em!important}
.round-back-button{min-height:52px!important;padding:0 18px!important;border:1px solid #bfd8c9!important;border-radius:14px!important;background:#fff!important;color:#1d6242!important;font-weight:800!important}

.opponent-strip{
  min-height:82px!important;padding:12px 16px!important;margin-bottom:14px!important;
  border-radius:18px!important;background:#f8fcfa!important;box-shadow:none!important;
}
.opponent-strip>span{width:48px!important;height:48px!important;border-radius:14px!important;font-size:23px!important}
.opponent-strip b{font-size:13px!important}.opponent-strip small{font-size:10px!important;margin-top:3px!important}

.round-match-meta{
  min-height:76px!important;margin-bottom:14px!important;padding:10px 16px!important;
  border-radius:18px!important;background:#fff!important;box-shadow:none!important;
}
.round-score-player span{font-size:11px!important;letter-spacing:.12em!important}.round-score-player strong{width:42px!important;height:42px!important;border-radius:11px!important;font-size:20px!important}
.round-target{padding:8px 20px!important;border-radius:999px!important;background:linear-gradient(180deg,#0b7b4b,#05643e)!important;color:#fff!important}.round-target b{font-size:12px!important}.round-target small{font-size:9px!important;color:#e3f7eb!important}

.round-play-grid{
  display:grid!important;grid-template-columns:210px minmax(0,1fr)!important;gap:16px!important;
  padding:14px!important;border:1px solid var(--ui-border)!important;border-radius:20px!important;
  background:#fff!important;box-shadow:none!important;
}
.round-player-choice{
  min-height:150px!important;padding:16px!important;border-radius:17px!important;
  background:#f7faf8!important;border:1px solid #e1ebe5!important;
}
.round-player-choice>span{font-size:9px!important;letter-spacing:.14em!important}.solo-player-chip{min-height:48px!important;border-radius:12px!important;background:#e9f5ee!important;color:#08633e!important}
.answer-area{min-height:160px!important;padding:0!important}
.answer-area>label{font-size:10px!important;letter-spacing:.13em!important;margin-bottom:8px!important}
.answer-box{
  display:grid!important;grid-template-columns:minmax(0,1fr) 180px 128px!important;gap:10px!important;
}
.answer-box input{
  min-height:72px!important;padding:0 20px!important;border:1px solid #c6dccc!important;border-radius:16px!important;
  font-size:17px!important;background:#fff!important;
}
.answer-box input:focus{border-color:#2a9960!important;box-shadow:0 0 0 4px rgba(42,153,96,.12)!important}
.answer-box>button{
  min-height:72px!important;border-radius:15px!important;font-size:14px!important;font-weight:900!important;
  background:linear-gradient(180deg,#0b7a4a,#05603b)!important;color:#fff!important;border:0!important;
}
.answer-box .answer-pass-button{background:var(--ui-cream)!important;color:#78500c!important;border:1px solid #ecd293!important;box-shadow:none!important}

.player-suggestions{
  max-height:260px!important;margin-top:10px!important;padding:10px!important;
  border:1px solid #e0e9e3!important;border-radius:16px!important;background:#fafcfb!important;
}
.player-suggestions__label{font-size:8px!important;letter-spacing:.14em!important}
.player-suggestions__grid{grid-template-columns:1fr 1fr!important;gap:8px!important}
.player-suggestions button{min-height:58px!important;padding:8px 10px!important;border-radius:12px!important;background:#f0f4f2!important}
.player-suggestions button b{font-size:11px!important}.player-suggestions button small{font-size:8px!important}.player-suggestion-flag{width:34px!important;height:34px!important}
.round-pass-status{margin-top:12px!important}.round-pass-status span{padding:8px 14px!important;border-radius:999px!important;font-size:9px!important}
.round-arena .feedback{min-height:42px!important;margin-top:10px!important;font-size:11px!important}

/* Modal / online alanları */
.modal-card{border-radius:22px!important;border:1px solid var(--ui-border)!important;box-shadow:0 24px 70px rgba(10,35,22,.20)!important}
.online-members-panel,.member-section{border-radius:16px!important}
.room-member span{white-space:normal!important;overflow:visible!important;text-overflow:clip!important;word-break:break-word!important}
.online-exit{width:auto!important;min-width:118px!important;min-height:40px!important;padding:0 14px!important}

/* 1536 ve altı */
@media (max-width:1550px){
  .app-shell{width:calc(100% - 24px)!important;margin-top:12px!important}
  .portal-home-button{left:28px!important;top:24px!important;height:46px!important}
  .topbar{min-height:70px!important;padding-left:174px!important}
  .brand img{width:44px!important;height:44px!important}.brand strong{font-size:21px!important}
  .main-grid{grid-template-columns:minmax(0,1fr) 310px!important;gap:12px!important}
  .match-settings__group{min-height:176px!important;padding:24px 22px 20px 84px!important}.match-settings__group::before{left:22px;top:24px;width:48px;height:48px;font-size:25px}.setting-tabs{margin-left:-62px!important}.setting-tabs button{height:46px!important}
  .players-grid{min-height:350px!important;grid-template-columns:minmax(0,1fr) 76px minmax(0,1fr)!important;gap:12px!important}.player-card{min-height:326px!important;padding:17px!important}.club-search{min-height:82px!important}.club-summary>div{min-height:62px!important}.role-card{min-height:66px!important}
  .game-actions{min-height:80px!important}.game-actions .btn{min-height:52px!important;min-width:205px!important}
  .side-card{padding:16px!important}.data-grid>div{min-height:66px!important;padding:9px!important}.data-grid strong{font-size:15px!important}
  .round-scoreboard,.round-arena .round-scoreboard{min-height:160px!important;padding:18px 24px!important;grid-template-columns:minmax(0,1fr) 104px minmax(0,1fr)!important}.round-team{min-height:94px!important}.round-team b{font-size:20px!important}.timer-ring{width:96px!important;height:96px!important}.timer-ring strong{font-size:34px!important}
  .round-content,.round-arena .round-content{padding:20px 22px 24px!important}.round-heading-row h3{font-size:25px!important}.round-play-grid{grid-template-columns:180px minmax(0,1fr)!important}.answer-box{grid-template-columns:minmax(0,1fr) 158px 110px!important}.answer-box input,.answer-box>button{min-height:64px!important}
}

/* 1366×768 için daha kompakt masaüstü */
@media (max-width:1380px){
  .app-shell{width:calc(100% - 18px)!important;margin:8px auto 16px!important}
  .portal-home-button{left:20px!important;top:18px!important;height:42px!important;font-size:12px!important}
  .topbar{top:7px!important;min-height:60px!important;padding:8px 12px 8px 154px!important}.brand img{width:38px!important;height:38px!important}.brand strong{font-size:18px!important}.topnav button{min-height:42px!important;font-size:13px!important}
  .main-grid{margin-top:10px!important;grid-template-columns:minmax(0,1fr) 284px!important;gap:10px!important}
  .mode-switch--three{margin-bottom:8px!important}.mode-switch--three button{min-height:48px!important}.mode-switch--three button>span{width:30px!important;height:30px!important}.mode-switch--three button small{display:none!important}
  .solo-settings{min-height:48px!important;margin-bottom:8px!important}
  .match-settings{gap:10px!important;margin-bottom:10px!important}.match-settings__group{min-height:140px!important;padding:18px 16px 14px 72px!important;border-radius:18px!important}.match-settings__group::before{left:17px;top:18px;width:42px;height:42px;font-size:21px}.match-settings__group>div:first-child span{font-size:9px!important}.match-settings__group>div:first-child b{font-size:13px!important}.setting-tabs{margin-left:-55px!important;padding:5px!important}.setting-tabs button{height:38px!important;font-size:11px!important}
  .players-grid{min-height:298px!important;padding:10px!important;border-radius:21px!important}.player-card{min-height:278px!important;padding:13px!important;border-radius:18px!important}.player-card__head{margin-bottom:10px!important}.player-label{font-size:10px!important}.score-chip strong{width:30px!important;height:30px!important;min-width:30px!important;font-size:14px!important}.club-search{min-height:66px!important;padding:8px 10px!important}.club-search input{font-size:13px!important}.club-summary{margin-top:9px!important;gap:6px!important}.club-summary>div{min-height:50px!important;padding:8px!important}.role-card{min-height:52px!important;margin-top:7px!important;padding:9px!important}.versus span{width:58px!important;height:58px!important;font-size:19px!important}
  .game-actions{min-height:64px!important;margin-top:10px!important;padding:8px!important;gap:20px!important}.game-actions .btn{min-height:44px!important;min-width:170px!important;font-size:14px!important}
  .side-stack{gap:10px!important}.side-card{padding:13px!important;border-radius:18px!important}.side-card__title h3{font-size:16px!important}.step{padding:7px 0!important}.data-grid{gap:6px!important;margin-top:10px!important}.data-grid>div{min-height:54px!important;padding:7px!important}.data-grid span{width:26px!important;height:26px!important}.data-grid strong{font-size:13px!important}.history-item{padding:7px 0!important;grid-template-columns:34px 1fr auto!important}.history-item>span{width:34px!important;height:34px!important}
  .round-scoreboard,.round-arena .round-scoreboard{min-height:132px!important;padding:14px 18px!important;grid-template-columns:minmax(0,1fr) 86px minmax(0,1fr)!important;gap:14px!important}.round-team{min-height:78px!important;padding:10px 12px!important}.round-team b{font-size:17px!important}.round-team span{font-size:9px!important}.round-team .club-badge--lg{width:58px!important;height:58px!important}.timer-ring{width:78px!important;height:78px!important;border-width:6px!important}.timer-ring strong{font-size:28px!important}.timer-ring span{font-size:7px!important}
  .round-content,.round-arena .round-content{padding:14px 16px 16px!important}.round-heading-row{margin-bottom:10px!important}.round-kicker{padding:6px 9px!important;font-size:8px!important}.round-heading-row h3{font-size:21px!important;margin-top:6px!important}.round-back-button{min-height:40px!important;padding:0 12px!important}.opponent-strip{min-height:58px!important;padding:8px 10px!important;margin-bottom:8px!important}.opponent-strip>span{width:38px!important;height:38px!important}.round-match-meta{min-height:56px!important;margin-bottom:8px!important;padding:7px 10px!important}.round-score-player strong{width:34px!important;height:34px!important;font-size:16px!important}.round-target{padding:6px 14px!important}.round-play-grid{grid-template-columns:150px minmax(0,1fr)!important;padding:10px!important;gap:10px!important}.round-player-choice{min-height:118px!important;padding:11px!important}.answer-area{min-height:118px!important}.answer-box{grid-template-columns:minmax(0,1fr) 142px 96px!important;gap:7px!important}.answer-box input,.answer-box>button{min-height:54px!important}.answer-box input{font-size:14px!important;padding:0 14px!important}.answer-box>button{font-size:11px!important}.player-suggestions{max-height:190px!important;margin-top:7px!important}.player-suggestions button{min-height:48px!important}.round-pass-status{margin-top:7px!important}.round-arena .feedback{min-height:34px!important;margin-top:5px!important}
}

/* Tablet ve mobil */
@media (max-width:900px){
  .app-shell{width:calc(100% - 16px)!important;margin:8px auto 18px!important}
  .portal-home-button{position:fixed!important;top:14px!important;left:14px!important;height:40px!important;padding:0 11px!important;font-size:11px!important}
  .topbar{top:8px!important;min-height:64px!important;padding:8px 10px 8px 122px!important;border-radius:16px!important}.brand img{width:38px!important;height:38px!important}.brand strong{font-size:16px!important}.brand span{font-size:7px!important}.topnav button{min-height:40px!important;padding:0 11px!important;font-size:12px!important}.topnav button span{display:none!important}
  .main-grid{display:flex!important;flex-direction:column!important;gap:10px!important;margin-top:10px!important}.game-card,.side-stack{width:100%!important}.side-stack{order:2!important}
  .mode-switch--three{grid-template-columns:1fr!important}.mode-switch--three button{min-height:54px!important}.mode-switch--three button small{display:block!important}
  .match-settings{grid-template-columns:1fr!important}.match-settings__group{min-height:150px!important}
  .players-grid{grid-template-columns:1fr!important;min-height:0!important;padding:9px!important}.player-card{min-height:0!important}.versus{padding:4px 0!important}.versus span{width:54px!important;height:54px!important}.versus small{display:none!important}
  .game-actions{flex-direction:column!important;gap:8px!important}.game-actions .btn{width:100%!important;min-width:0!important}
  .round-scoreboard,.round-arena .round-scoreboard{grid-template-columns:1fr 70px 1fr!important;gap:8px!important;padding:12px!important}.round-team{padding:8px!important}.round-team b{font-size:13px!important}.round-team span{font-size:7px!important}.round-team .club-badge--lg{width:48px!important;height:48px!important}.timer-ring{width:66px!important;height:66px!important}.timer-ring strong{font-size:23px!important}
  .round-heading-row{align-items:flex-start!important;gap:10px!important}.round-heading-row h3{font-size:20px!important}.round-back-button{font-size:10px!important;white-space:nowrap!important}
  .round-play-grid{grid-template-columns:1fr!important}.round-player-choice{min-height:0!important}.answer-box{grid-template-columns:1fr 1fr!important}.answer-box input{grid-column:1/-1!important}.answer-box>button{min-height:52px!important}.player-suggestions__grid{grid-template-columns:1fr!important}
  .side-stack{display:grid!important;grid-template-columns:1fr!important}.side-card{width:100%!important}
}

@media (max-width:520px){
  .portal-home-button span{display:none!important}.portal-home-button{width:40px!important;padding:0!important;justify-content:center!important}
  .topbar{padding-left:62px!important}.brand strong{font-size:14px!important}.brand span{display:none!important}
  .match-settings__group{padding-left:70px!important}.setting-tabs{margin-left:-50px!important;grid-template-columns:repeat(2,1fr)!important}
  .club-summary{grid-template-columns:1fr!important}.round-team>div:not(.club-badge){display:none!important}.round-scoreboard,.round-arena .round-scoreboard{grid-template-columns:1fr 62px 1fr!important}.round-team{justify-content:center!important}.round-team--right{justify-content:center!important}.timer-ring{width:58px!important;height:58px!important}.timer-ring strong{font-size:20px!important}.answer-box{grid-template-columns:1fr!important}.answer-box input,.answer-box>button{grid-column:auto!important}
}

/* 1920×1080 referans oranında oyun alanını dikey olarak dengeler. */
@media (min-width:1551px) and (min-height:900px){
  .app-shell.is-match-started .round-arena{min-height:820px!important}
  .app-shell.is-match-started .round-content{min-height:620px!important;display:flex!important;flex-direction:column!important}
  .app-shell.is-match-started .round-play-grid{min-height:190px!important}
  .app-shell.is-match-started .round-pass-status{margin-top:16px!important}
  .app-shell.is-match-started .feedback{margin-top:auto!important}
}


/* v24 refinements: 100% zoom should match the compact reference more closely */
.round-arena{overflow:hidden!important}
.round-scoreboard,.round-arena .round-scoreboard{
  position:relative!important;
  min-height:168px!important;
  padding:18px 28px!important;
  grid-template-columns:minmax(0,1fr) 132px minmax(0,1fr)!important;
  gap:18px!important;
  background:
    linear-gradient(90deg,rgba(9,103,63,.92) 0%,rgba(12,115,74,.72) 18%,rgba(26,88,90,.44) 33%,rgba(240,246,243,.92) 49.5%,rgba(26,88,90,.44) 67%,rgba(12,84,133,.76) 82%,rgba(6,45,100,.92) 100%),
    url('./stadium-lights-v8.svg') center/cover no-repeat!important;
}
.round-scoreboard::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(circle at 50% 42%, rgba(255,255,255,.68) 0, rgba(255,255,255,.18) 15%, transparent 32%),
    linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,0));
  opacity:1!important;
}
.round-scoreboard::after{
  content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:270px;height:170px;pointer-events:none;
  background:radial-gradient(circle, rgba(255,255,255,.42) 0%, rgba(255,255,255,.16) 34%, rgba(255,255,255,0) 68%);
}
.round-team{
  position:relative!important;z-index:1!important;
  min-height:108px!important;padding:14px 18px!important;border-radius:22px!important;
  background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.07))!important;
  border:1px solid rgba(255,255,255,.34)!important;
  box-shadow:0 10px 24px rgba(0,0,0,.10)!important;
  display:flex!important;align-items:center!important;gap:18px!important;
}
.round-team.round-team--right{justify-content:space-between!important}
.round-team > div{min-width:0!important}
.round-team b{font-size:20px!important;line-height:1.08!important;color:#fff!important;display:block!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.round-team span{font-size:11px!important;color:rgba(243,252,247,.94)!important;display:block!important;margin-top:7px!important}
.round-team .club-badge--lg{width:76px!important;height:76px!important;border-radius:20px!important;box-shadow:0 10px 22px rgba(0,0,0,.16)!important;background:linear-gradient(180deg,rgba(255,255,255,.94),rgba(231,238,235,.94))!important;border:2px solid rgba(255,255,255,.55)!important}
.round-team .club-badge--lg b{font-size:28px!important;letter-spacing:-.03em!important;color:#173225!important;line-height:1!important;margin:0!important}
.round-team .club-badge--lg.club-badge--flag{background:#fff!important}
.round-team .club-flag-image{border-radius:16px!important}
.timer-ring{
  position:relative!important;z-index:2!important;
  width:120px!important;height:120px!important;border:8px solid rgba(255,255,255,.75)!important;
  background:radial-gradient(circle at 50% 34%, #10aa61 0%, #0d8b52 24%, #075237 68%, #063826 100%)!important;
  box-shadow:0 0 0 5px rgba(67,219,134,.28),0 0 0 12px rgba(255,255,255,.20),0 18px 34px rgba(0,0,0,.16)!important;
  overflow:visible!important;
}
.timer-ring::before{
  content:"";position:absolute;inset:-9px;border-radius:50%;pointer-events:none;
  background:conic-gradient(#3df28f 0 74deg, rgba(255,255,255,.82) 74deg 328deg, rgba(61,242,143,.36) 328deg 360deg);
  -webkit-mask:radial-gradient(farthest-side, transparent calc(100% - 7px), #000 calc(100% - 6px));
          mask:radial-gradient(farthest-side, transparent calc(100% - 7px), #000 calc(100% - 6px));
}
.timer-ring::after{
  content:"";position:absolute;inset:8px;border-radius:50%;pointer-events:none;
  box-shadow:inset 0 2px 10px rgba(255,255,255,.16), inset 0 -12px 20px rgba(0,0,0,.18);
}
.timer-ring strong{position:relative!important;z-index:1!important;font-size:40px!important;line-height:1!important;color:#fff!important;text-shadow:0 2px 6px rgba(0,0,0,.18)!important}
.timer-ring span{position:relative!important;z-index:1!important;font-size:11px!important;letter-spacing:.14em!important;color:#effff5!important}
.round-content,.round-arena .round-content{padding:18px 20px 20px!important}
.round-heading-row{margin-bottom:12px!important}
.round-heading-row h3{font-size:22px!important;margin-top:8px!important}
.round-back-button{min-height:48px!important;padding:0 16px!important;font-size:14px!important}
.opponent-strip{min-height:72px!important;padding:10px 14px!important;margin-bottom:10px!important}
.round-match-meta{min-height:64px!important;margin-bottom:10px!important;padding:8px 14px!important}
.round-score-player strong{width:38px!important;height:38px!important;font-size:18px!important}
.round-play-grid{grid-template-columns:170px minmax(0,1fr)!important;gap:12px!important;padding:12px!important}
.round-player-choice{min-height:132px!important;padding:14px!important}
.answer-area{min-height:128px!important}
.answer-box{grid-template-columns:minmax(0,1fr) 150px 108px!important;gap:8px!important}
.answer-box input{min-height:60px!important;padding:0 18px!important;font-size:16px!important}
.answer-box>button{min-height:60px!important;font-size:13px!important}
.player-suggestions{max-height:196px!important;margin-top:8px!important}
.player-suggestions button{min-height:50px!important}
.player-suggestions button b{font-size:10px!important}
.player-suggestions button small{font-size:8px!important}
.round-pass-status{margin-top:8px!important}
.round-arena .feedback{margin-top:6px!important;min-height:34px!important}

/* Avoid very tall match screen on large desktops at 100% zoom */
@media (min-width:1551px) and (min-height:900px){
  .app-shell.is-match-started .round-arena{min-height:0!important}
  .app-shell.is-match-started .round-content{min-height:0!important;display:block!important}
  .app-shell.is-match-started .round-play-grid{min-height:0!important}
}

@media (max-width:1550px){
  .app-shell{width:calc(100% - 18px)!important;margin-top:10px!important}
  .portal-home-button{left:16px!important;top:16px!important;height:44px!important}
  .topbar{min-height:62px!important;padding-left:164px!important}
  .brand img{width:42px!important;height:42px!important}.brand strong{font-size:18px!important}
  .main-grid{grid-template-columns:minmax(0,1fr) 274px!important;gap:10px!important}
  .round-scoreboard,.round-arena .round-scoreboard{min-height:156px!important;padding:16px 18px!important;grid-template-columns:minmax(0,1fr) 114px minmax(0,1fr)!important}
  .round-scoreboard::after{width:230px!important;height:144px!important}
  .round-team{min-height:96px!important;padding:12px 14px!important;gap:14px!important}
  .round-team b{font-size:18px!important}.round-team span{font-size:10px!important}.round-team .club-badge--lg{width:66px!important;height:66px!important}.round-team .club-badge--lg b{font-size:24px!important}
  .timer-ring{width:102px!important;height:102px!important}.timer-ring strong{font-size:34px!important}
}

@media (max-width:1380px){
  .round-scoreboard,.round-arena .round-scoreboard{min-height:138px!important;padding:14px 16px!important;grid-template-columns:minmax(0,1fr) 96px minmax(0,1fr)!important;gap:12px!important}
  .round-scoreboard::after{width:190px!important;height:118px!important}
  .round-team{min-height:82px!important;padding:10px 12px!important;gap:11px!important}.round-team b{font-size:16px!important}.round-team span{font-size:9px!important;margin-top:5px!important}.round-team .club-badge--lg{width:58px!important;height:58px!important;border-radius:16px!important}.round-team .club-badge--lg b{font-size:20px!important}
  .timer-ring{width:84px!important;height:84px!important;border-width:6px!important}.timer-ring strong{font-size:28px!important}.timer-ring span{font-size:8px!important}
}

@media (max-width:900px){
  .round-scoreboard,.round-arena .round-scoreboard{padding:12px!important;grid-template-columns:1fr 74px 1fr!important;min-height:122px!important}
  .round-team{min-height:72px!important;padding:8px!important;gap:8px!important;border-radius:16px!important}.round-team b{font-size:12px!important}.round-team span{font-size:7px!important;margin-top:3px!important}.round-team .club-badge--lg{width:44px!important;height:44px!important;border-radius:13px!important}.round-team .club-badge--lg b{font-size:16px!important}
  .timer-ring{width:68px!important;height:68px!important}.timer-ring strong{font-size:22px!important}.timer-ring span{font-size:6px!important}
}


/* v25 compact match-play viewport tuning: make 3 suggestion rows visible at 100% */
@media (min-width:1366px){
  .app-shell.is-match-started .main-grid{gap:10px!important}
  .app-shell.is-match-started .round-scoreboard,.app-shell.is-match-started .round-arena .round-scoreboard{
    min-height:128px!important;
    padding:12px 18px!important;
    grid-template-columns:minmax(0,1fr) 92px minmax(0,1fr)!important;
    gap:12px!important;
  }
  .app-shell.is-match-started .round-scoreboard::after{width:176px!important;height:108px!important}
  .app-shell.is-match-started .round-team{min-height:74px!important;padding:9px 12px!important;gap:10px!important;border-radius:18px!important}
  .app-shell.is-match-started .round-team b{font-size:17px!important}
  .app-shell.is-match-started .round-team span{font-size:9px!important;margin-top:4px!important}
  .app-shell.is-match-started .round-team .club-badge--lg{width:54px!important;height:54px!important;border-radius:15px!important}
  .app-shell.is-match-started .round-team .club-badge--lg b{font-size:18px!important}
  .app-shell.is-match-started .timer-ring{width:78px!important;height:78px!important;border-width:6px!important;box-shadow:0 0 0 4px rgba(67,219,134,.24),0 0 0 9px rgba(255,255,255,.18),0 12px 22px rgba(0,0,0,.14)!important}
  .app-shell.is-match-started .timer-ring strong{font-size:28px!important}
  .app-shell.is-match-started .timer-ring span{font-size:7px!important}

  .app-shell.is-match-started .round-content,.app-shell.is-match-started .round-arena .round-content{padding:12px 16px 14px!important}
  .app-shell.is-match-started .round-heading-row{margin-bottom:8px!important}
  .app-shell.is-match-started .round-heading-row h3{font-size:19px!important;margin-top:6px!important}
  .app-shell.is-match-started .round-back-button{min-height:38px!important;padding:0 12px!important;font-size:12px!important}
  .app-shell.is-match-started .round-kicker{padding:6px 10px!important;font-size:9px!important}
  .app-shell.is-match-started .opponent-strip{min-height:56px!important;padding:8px 10px!important;margin-bottom:8px!important}
  .app-shell.is-match-started .opponent-strip>span{width:40px!important;height:40px!important}
  .app-shell.is-match-started .round-match-meta{min-height:54px!important;padding:6px 12px!important;margin-bottom:8px!important}
  .app-shell.is-match-started .round-score-player strong{width:34px!important;height:34px!important;font-size:16px!important}
  .app-shell.is-match-started .round-target{padding:6px 14px!important;font-size:12px!important}

  .app-shell.is-match-started .round-play-grid{grid-template-columns:158px minmax(0,1fr)!important;gap:10px!important;padding:10px!important}
  .app-shell.is-match-started .round-player-choice{min-height:104px!important;padding:10px!important}
  .app-shell.is-match-started .answer-area{min-height:96px!important}
  .app-shell.is-match-started .answer-box{grid-template-columns:minmax(0,1fr) 138px 98px!important;gap:7px!important}
  .app-shell.is-match-started .answer-box input{min-height:54px!important;padding:0 16px!important;font-size:15px!important}
  .app-shell.is-match-started .answer-box>button{min-height:54px!important;font-size:12px!important}
  .app-shell.is-match-started .player-suggestions{max-height:248px!important;margin-top:6px!important}
  .app-shell.is-match-started .player-suggestions__label{font-size:8px!important;letter-spacing:.12em!important;margin-bottom:4px!important}
  .app-shell.is-match-started .player-suggestions__grid{gap:6px!important}
  .app-shell.is-match-started .player-suggestions button{min-height:44px!important;padding:6px 9px!important}
  .app-shell.is-match-started .player-suggestion-flag{width:28px!important;height:28px!important}
  .app-shell.is-match-started .player-suggestions button b{font-size:10px!important}
  .app-shell.is-match-started .player-suggestions button small{font-size:8px!important;line-height:1.15!important}
  .app-shell.is-match-started .round-pass-status{margin-top:6px!important}
  .app-shell.is-match-started .round-arena .feedback{min-height:28px!important;margin-top:4px!important}
}


/* v26 further compacting for 100% zoom and smaller Ana Menü button */
.portal-home-button{
  top:16px!important;
  left:max(16px,calc((100vw - 1480px)/2 + 16px))!important;
  height:42px!important;
  padding:0 12px!important;
  border-radius:13px!important;
  font-size:13px!important;
  gap:8px!important;
}
.portal-home-button svg{width:16px!important;height:16px!important}
.topbar{padding-left:162px!important}
@media (max-width:900px){
  .portal-home-button{height:38px!important;padding:0 10px!important;font-size:10px!important}
  .topbar{padding-left:112px!important}
}
@media (max-width:520px){
  .portal-home-button{width:38px!important;height:38px!important;padding:0!important}
  .topbar{padding-left:58px!important}
}

@media (min-width:1366px){
  .app-shell.is-match-started .main-grid{gap:8px!important;margin-top:8px!important}
  .app-shell.is-match-started .round-arena{border-radius:22px!important}
  .app-shell.is-match-started .round-scoreboard,
  .app-shell.is-match-started .round-arena .round-scoreboard{
    min-height:114px!important;
    padding:12px 16px!important;
    grid-template-columns:minmax(0,1fr) 74px minmax(0,1fr)!important;
    gap:12px!important;
    border-radius:22px 22px 0 0!important;
  }
  .app-shell.is-match-started .round-scoreboard::after{width:154px!important;height:98px!important}
  .app-shell.is-match-started .round-team{min-height:64px!important;padding:8px 10px!important;gap:9px!important;border-radius:16px!important}
  .app-shell.is-match-started .round-team b{font-size:15px!important;line-height:1.08!important}
  .app-shell.is-match-started .round-team span{font-size:8px!important;margin-top:2px!important}
  .app-shell.is-match-started .round-team .club-badge--lg{width:48px!important;height:48px!important;border-radius:13px!important}
  .app-shell.is-match-started .round-team .club-badge--lg b{font-size:16px!important}
  .app-shell.is-match-started .timer-ring{width:68px!important;height:68px!important;border-width:5px!important;box-shadow:0 0 0 3px rgba(67,219,134,.24),0 0 0 7px rgba(255,255,255,.18),0 10px 18px rgba(0,0,0,.14)!important}
  .app-shell.is-match-started .timer-ring strong{font-size:24px!important}
  .app-shell.is-match-started .timer-ring span{font-size:6px!important;letter-spacing:.11em!important}

  .app-shell.is-match-started .round-content,
  .app-shell.is-match-started .round-arena .round-content{padding:10px 14px 12px!important}
  .app-shell.is-match-started .round-heading-row{margin-bottom:6px!important}
  .app-shell.is-match-started .round-heading-row h3{font-size:17px!important;margin-top:4px!important;line-height:1.1!important}
  .app-shell.is-match-started .round-back-button{min-height:34px!important;padding:0 10px!important;font-size:11px!important}
  .app-shell.is-match-started .round-kicker{padding:5px 9px!important;font-size:8px!important}
  .app-shell.is-match-started .opponent-strip{min-height:48px!important;padding:6px 8px!important;margin-bottom:6px!important;border-radius:14px!important}
  .app-shell.is-match-started .opponent-strip>span{width:34px!important;height:34px!important;border-radius:11px!important}
  .app-shell.is-match-started .opponent-strip b{font-size:12px!important}
  .app-shell.is-match-started .opponent-strip small{font-size:9px!important;margin-top:2px!important}
  .app-shell.is-match-started .round-match-meta{min-height:44px!important;padding:4px 10px!important;margin-bottom:6px!important;border-radius:14px!important}
  .app-shell.is-match-started .round-score-player span{font-size:10px!important}
  .app-shell.is-match-started .round-score-player strong{width:30px!important;height:30px!important;font-size:14px!important}
  .app-shell.is-match-started .round-target{padding:5px 12px!important;font-size:11px!important}
  .app-shell.is-match-started .round-target b{font-size:11px!important}
  .app-shell.is-match-started .round-target small{font-size:8px!important}

  .app-shell.is-match-started .round-play-grid{grid-template-columns:138px minmax(0,1fr)!important;gap:8px!important;padding:8px!important;border-radius:16px!important}
  .app-shell.is-match-started .round-player-choice{min-height:78px!important;padding:8px!important;border-radius:14px!important}
  .app-shell.is-match-started .round-player-choice>span{font-size:8px!important}
  .app-shell.is-match-started .solo-player-chip{min-height:40px!important;font-size:12px!important}
  .app-shell.is-match-started .answer-area{min-height:78px!important}
  .app-shell.is-match-started .answer-area>label{font-size:9px!important;margin-bottom:5px!important}
  .app-shell.is-match-started .answer-box{grid-template-columns:minmax(0,1fr) 130px 92px!important;gap:6px!important}
  .app-shell.is-match-started .answer-box input{min-height:46px!important;padding:0 14px!important;font-size:14px!important;border-radius:14px!important}
  .app-shell.is-match-started .answer-box>button{min-height:46px!important;font-size:11px!important;border-radius:13px!important}
  .app-shell.is-match-started .player-suggestions{max-height:212px!important;margin-top:5px!important;padding:8px!important;border-radius:14px!important}
  .app-shell.is-match-started .player-suggestions__label{font-size:7px!important;letter-spacing:.11em!important;margin-bottom:3px!important}
  .app-shell.is-match-started .player-suggestions__grid{gap:5px!important}
  .app-shell.is-match-started .player-suggestions button{min-height:40px!important;padding:5px 8px!important;border-radius:10px!important}
  .app-shell.is-match-started .player-suggestion-flag{width:24px!important;height:24px!important}
  .app-shell.is-match-started .player-suggestions button b{font-size:9px!important}
  .app-shell.is-match-started .player-suggestions button small{font-size:7px!important;line-height:1.1!important}
  .app-shell.is-match-started .round-pass-status{margin-top:4px!important}
  .app-shell.is-match-started .round-arena .feedback{min-height:22px!important;margin-top:3px!important;font-size:11px!important}
}


/* v27 final tightening for 100% zoom: 3 visible player rows + smaller home button */
.portal-home-button{
  top:14px!important;
  left:max(14px,calc((100vw - 1500px)/2 + 14px))!important;
  height:36px!important;
  padding:0 10px!important;
  border-radius:12px!important;
  font-size:11px!important;
  gap:7px!important;
}
.portal-home-button svg{width:15px!important;height:15px!important}
.topbar{padding-left:172px!important}
@media (max-width:900px){
  .portal-home-button{top:10px!important;left:10px!important;height:34px!important;padding:0 10px!important;font-size:10px!important;border-radius:11px!important}
  .topbar{padding-left:108px!important}
}

@media (min-width:1366px){
  .app-shell.is-match-started{width:min(1562px,100% - 16px)!important;margin:4px auto 10px!important}
  .app-shell.is-match-started .main-grid{grid-template-columns:minmax(0,1fr) 270px!important;gap:8px!important;margin-top:6px!important}
  .app-shell.is-match-started .topbar{min-height:50px!important;padding:5px 12px!important;top:3px!important}
  .app-shell.is-match-started .brand img{width:32px!important;height:32px!important}
  .app-shell.is-match-started .brand h1{font-size:19px!important;line-height:1!important}
  .app-shell.is-match-started .brand p{font-size:8px!important;letter-spacing:.22em!important;margin-top:2px!important}

  .app-shell.is-match-started .round-arena{margin-top:6px!important;border-radius:18px!important;scroll-margin-top:60px!important}
  .app-shell.is-match-started .round-scoreboard,
  .app-shell.is-match-started .round-arena .round-scoreboard{min-height:96px!important;padding:7px 14px!important;grid-template-columns:minmax(0,1fr) 64px minmax(0,1fr)!important;gap:10px!important;border-radius:18px 18px 0 0!important}
  .app-shell.is-match-started .round-scoreboard::after{width:140px!important;height:86px!important}
  .app-shell.is-match-started .round-team{min-height:58px!important;padding:6px 9px!important;gap:8px!important;border-radius:14px!important}
  .app-shell.is-match-started .round-team .club-badge--lg{width:42px!important;height:42px!important;border-radius:12px!important}
  .app-shell.is-match-started .round-team .club-badge--lg b{font-size:15px!important}
  .app-shell.is-match-started .round-team b{font-size:14px!important;line-height:1.04!important}
  .app-shell.is-match-started .round-team span{font-size:8px!important;line-height:1.05!important}
  .app-shell.is-match-started .timer-ring{width:60px!important;height:60px!important;border-width:5px!important;box-shadow:0 0 0 3px rgba(67,219,134,.23),0 0 0 7px rgba(255,255,255,.16),0 8px 16px rgba(0,0,0,.14)!important}
  .app-shell.is-match-started .timer-ring strong{font-size:20px!important}
  .app-shell.is-match-started .timer-ring span{font-size:6px!important;letter-spacing:.10em!important}

  .app-shell.is-match-started .round-content,
  .app-shell.is-match-started .round-arena .round-content{padding:8px 12px 10px!important}
  .app-shell.is-match-started .round-kicker{padding:4px 8px!important;font-size:8px!important;border-radius:999px!important}
  .app-shell.is-match-started .round-heading-row{margin-bottom:5px!important}
  .app-shell.is-match-started .round-heading-row h3{font-size:16px!important;line-height:1.08!important;margin-top:4px!important}
  .app-shell.is-match-started .round-back-button{min-height:32px!important;padding:0 10px!important;font-size:11px!important;border-radius:12px!important}
  .app-shell.is-match-started .opponent-strip{min-height:44px!important;padding:6px 8px!important;margin-bottom:5px!important;border-radius:13px!important}
  .app-shell.is-match-started .opponent-strip>span{width:32px!important;height:32px!important;border-radius:10px!important}
  .app-shell.is-match-started .opponent-strip b{font-size:12px!important;line-height:1.05!important}
  .app-shell.is-match-started .opponent-strip small{font-size:8px!important;line-height:1.05!important;margin-top:1px!important}
  .app-shell.is-match-started .round-match-meta{min-height:40px!important;padding:4px 8px!important;margin-bottom:5px!important;border-radius:13px!important}
  .app-shell.is-match-started .round-score-player span{font-size:10px!important}
  .app-shell.is-match-started .round-score-player strong{width:28px!important;height:28px!important;font-size:13px!important}
  .app-shell.is-match-started .round-target{padding:4px 11px!important;font-size:10px!important;border-radius:999px!important}
  .app-shell.is-match-started .round-target b{font-size:10px!important;line-height:1.05!important}
  .app-shell.is-match-started .round-target small{font-size:7px!important;line-height:1.05!important}

  .app-shell.is-match-started .round-play-grid{grid-template-columns:128px minmax(0,1fr)!important;gap:7px!important;padding:7px!important;border-radius:14px!important}
  .app-shell.is-match-started .round-player-choice{min-height:70px!important;padding:7px!important;border-radius:12px!important}
  .app-shell.is-match-started .round-player-choice>span{font-size:8px!important;margin-bottom:4px!important}
  .app-shell.is-match-started .solo-player-chip{min-height:36px!important;border-radius:10px!important;font-size:11px!important;padding:0 8px!important}
  .app-shell.is-match-started .answer-area{min-height:66px!important;padding:8px!important;border-radius:12px!important}
  .app-shell.is-match-started .answer-area>label{font-size:8px!important;margin-bottom:4px!important;letter-spacing:.12em!important}
  .app-shell.is-match-started .answer-box{grid-template-columns:minmax(0,1fr) 126px 88px!important;gap:6px!important}
  .app-shell.is-match-started .answer-box input{min-height:42px!important;padding:0 12px!important;font-size:13px!important;border-radius:13px!important}
  .app-shell.is-match-started .answer-box>button{min-height:42px!important;font-size:11px!important;border-radius:12px!important;padding:0 10px!important}
  .app-shell.is-match-started .player-suggestions{max-height:154px!important;overflow:auto!important;margin-top:4px!important;padding:6px!important;border-radius:12px!important}
  .app-shell.is-match-started .player-suggestions__label{font-size:7px!important;letter-spacing:.11em!important;margin-bottom:2px!important}
  .app-shell.is-match-started .player-suggestions__grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:4px!important}
  .app-shell.is-match-started .player-suggestions button{min-height:34px!important;padding:4px 7px!important;border-radius:9px!important;gap:6px!important}
  .app-shell.is-match-started .player-suggestion-flag{width:20px!important;height:20px!important;border-radius:5px!important}
  .app-shell.is-match-started .player-suggestions button b{font-size:8px!important;line-height:1.05!important}
  .app-shell.is-match-started .player-suggestions button small{font-size:6px!important;line-height:1.05!important}
  .app-shell.is-match-started .round-pass-status{margin-top:3px!important}
  .app-shell.is-match-started .round-arena .feedback{min-height:18px!important;margin-top:2px!important;font-size:10px!important}

  .app-shell.is-match-started .side-stack{gap:7px!important}
  .app-shell.is-match-started .side-card{padding:11px!important;border-radius:16px!important}
  .app-shell.is-match-started .side-card h4{font-size:12px!important;margin-bottom:8px!important}
  .app-shell.is-match-started .history-list{gap:7px!important}
  .app-shell.is-match-started .history-item{padding:8px!important;border-radius:12px!important}
}


/* v28 ultra-compact match viewport for true 3 suggestion rows at 100% */
@media (min-width:1366px){
  .app-shell.is-match-started{width:min(1570px,100% - 12px)!important;margin:2px auto 8px!important}
  .app-shell.is-match-started .main-grid{grid-template-columns:minmax(0,1fr) 262px!important;gap:6px!important;margin-top:4px!important}
  .app-shell.is-match-started .topbar{min-height:44px!important;padding:4px 12px!important;top:2px!important;border-radius:20px!important}
  .app-shell.is-match-started .brand{gap:9px!important}
  .app-shell.is-match-started .brand img{width:28px!important;height:28px!important}
  .app-shell.is-match-started .brand h1{font-size:17px!important;line-height:1!important}
  .app-shell.is-match-started .brand p{font-size:7px!important;letter-spacing:.20em!important;margin-top:1px!important}

  .app-shell.is-match-started .round-arena{margin-top:4px!important;border-radius:16px!important}
  .app-shell.is-match-started .round-scoreboard,
  .app-shell.is-match-started .round-arena .round-scoreboard{min-height:84px!important;padding:5px 12px!important;grid-template-columns:minmax(0,1fr) 58px minmax(0,1fr)!important;gap:8px!important;border-radius:16px 16px 0 0!important}
  .app-shell.is-match-started .round-scoreboard::after{width:128px!important;height:76px!important}
  .app-shell.is-match-started .round-team{min-height:50px!important;padding:5px 8px!important;gap:7px!important;border-radius:13px!important}
  .app-shell.is-match-started .round-team .club-badge--lg{width:38px!important;height:38px!important;border-radius:11px!important}
  .app-shell.is-match-started .round-team .club-badge--lg b{font-size:14px!important}
  .app-shell.is-match-started .round-team b{font-size:13px!important;line-height:1.03!important}
  .app-shell.is-match-started .round-team span{font-size:7px!important;line-height:1.03!important}
  .app-shell.is-match-started .timer-ring{width:54px!important;height:54px!important;border-width:4px!important;box-shadow:0 0 0 2px rgba(67,219,134,.22),0 0 0 5px rgba(255,255,255,.14),0 6px 12px rgba(0,0,0,.12)!important}
  .app-shell.is-match-started .timer-ring strong{font-size:18px!important}
  .app-shell.is-match-started .timer-ring span{font-size:5px!important;letter-spacing:.1em!important}

  .app-shell.is-match-started .round-content,
  .app-shell.is-match-started .round-arena .round-content{padding:6px 10px 8px!important}
  .app-shell.is-match-started .round-kicker{padding:3px 8px!important;font-size:7px!important}
  .app-shell.is-match-started .round-heading-row{margin-bottom:4px!important;gap:8px!important}
  .app-shell.is-match-started .round-heading-row h3{font-size:15px!important;line-height:1.05!important;margin-top:2px!important}
  .app-shell.is-match-started .round-back-button{min-height:30px!important;padding:0 10px!important;font-size:10px!important;border-radius:11px!important}
  .app-shell.is-match-started .opponent-strip{min-height:38px!important;padding:5px 7px!important;margin-bottom:4px!important;border-radius:12px!important}
  .app-shell.is-match-started .opponent-strip>span{width:28px!important;height:28px!important;border-radius:9px!important}
  .app-shell.is-match-started .opponent-strip b{font-size:11px!important;line-height:1.04!important}
  .app-shell.is-match-started .opponent-strip small{font-size:7px!important;line-height:1.02!important;margin-top:1px!important}
  .app-shell.is-match-started .round-match-meta{min-height:34px!important;padding:3px 8px!important;margin-bottom:4px!important;border-radius:12px!important}
  .app-shell.is-match-started .round-score-player span{font-size:9px!important}
  .app-shell.is-match-started .round-score-player strong{width:26px!important;height:26px!important;font-size:12px!important}
  .app-shell.is-match-started .round-target{padding:4px 10px!important;font-size:9px!important}
  .app-shell.is-match-started .round-target b{font-size:9px!important;line-height:1.03!important}
  .app-shell.is-match-started .round-target small{font-size:6px!important;line-height:1.02!important}

  .app-shell.is-match-started .round-play-grid{grid-template-columns:114px minmax(0,1fr)!important;gap:6px!important;padding:6px!important;border-radius:13px!important}
  .app-shell.is-match-started .round-player-choice{min-height:62px!important;padding:6px!important;border-radius:11px!important}
  .app-shell.is-match-started .round-player-choice>span{font-size:7px!important;margin-bottom:3px!important}
  .app-shell.is-match-started .solo-player-chip{min-height:32px!important;border-radius:9px!important;font-size:10px!important;padding:0 7px!important}
  .app-shell.is-match-started .answer-area{min-height:58px!important;padding:6px!important;border-radius:11px!important}
  .app-shell.is-match-started .answer-area>label{font-size:7px!important;margin-bottom:3px!important;letter-spacing:.1em!important}
  .app-shell.is-match-started .answer-box{grid-template-columns:minmax(0,1fr) 122px 84px!important;gap:5px!important}
  .app-shell.is-match-started .answer-box input{min-height:38px!important;padding:0 11px!important;font-size:12px!important;border-radius:12px!important}
  .app-shell.is-match-started .answer-box>button{min-height:38px!important;font-size:10px!important;border-radius:11px!important;padding:0 9px!important}
  .app-shell.is-match-started .player-suggestions{max-height:132px!important;overflow:auto!important;margin-top:3px!important;padding:5px!important;border-radius:11px!important}
  .app-shell.is-match-started .player-suggestions__label{font-size:6px!important;letter-spacing:.10em!important;margin-bottom:2px!important}
  .app-shell.is-match-started .player-suggestions__grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:3px!important}
  .app-shell.is-match-started .player-suggestions button{min-height:30px!important;padding:4px 6px!important;border-radius:8px!important;gap:5px!important}
  .app-shell.is-match-started .player-suggestion-flag{width:18px!important;height:18px!important;border-radius:4px!important}
  .app-shell.is-match-started .player-suggestions button b{font-size:8px!important;line-height:1!important}
  .app-shell.is-match-started .player-suggestions button small{font-size:6px!important;line-height:1!important}
  .app-shell.is-match-started .round-pass-status{margin-top:2px!important}
  .app-shell.is-match-started .round-arena .feedback{min-height:16px!important;margin-top:1px!important;font-size:9px!important}

  .app-shell.is-match-started .side-stack{gap:6px!important}
  .app-shell.is-match-started .side-card{padding:10px!important;border-radius:15px!important}
  .app-shell.is-match-started .side-card h4{font-size:11px!important;margin-bottom:6px!important}
  .app-shell.is-match-started .history-list{gap:6px!important}
  .app-shell.is-match-started .history-item{padding:7px!important;border-radius:11px!important}
}

/* V34 — takım kimliği, ortak 3 sn sayacı ve veri rehberi */
.topnav__info{
  color:#0b6843!important;
  background:#edf7f1!important;
  border:1px solid #cfe5d8!important;
  box-shadow:none!important;
}
.topnav__info:hover{background:#e3f2e9!important}

/* Seçilen takım kartlarında kulüp renklerini yeniden görünür yap. */
.player-card--selected{
  border-color:color-mix(in srgb,var(--team-primary) 34%,#d8e6dc)!important;
  background:
    linear-gradient(180deg,color-mix(in srgb,var(--team-primary) 7%,#fff) 0%,#fff 42%,color-mix(in srgb,var(--team-secondary) 7%,#f8fbf9) 100%)!important;
}
.player-card--selected::before{
  background:linear-gradient(90deg,var(--team-primary),var(--team-secondary))!important;
}

/* Tur ekranındaki iki takım alanı kendi gerçek renkleriyle çalışır. */
.round-team{
  position:relative!important;
  overflow:hidden!important;
  isolation:isolate!important;
  background:linear-gradient(125deg,var(--team-primary,#176f48) 0%,color-mix(in srgb,var(--team-primary,#176f48) 74%,#071d15) 52%,var(--team-secondary,#b6d6c3) 100%)!important;
  border-color:rgba(255,255,255,.38)!important;
}
.round-team::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(0,0,0,.18),transparent 42%,rgba(255,255,255,.08)),
    radial-gradient(circle at 20% 0%,rgba(255,255,255,.20),transparent 42%);
}
.round-team--right::before{
  background:
    linear-gradient(270deg,rgba(0,0,0,.18),transparent 42%,rgba(255,255,255,.08)),
    radial-gradient(circle at 80% 0%,rgba(255,255,255,.20),transparent 42%);
}
.round-team b,.round-team span{color:#fff!important;text-shadow:0 2px 8px rgba(0,0,0,.30)!important}

/* Kulüp rozetleri iki veya üç harfli kodu taşmadan gösterir. */
.club-badge:not(.club-badge--flag){
  background:linear-gradient(135deg,var(--club-accent) 0 52%,var(--club-secondary) 52% 100%)!important;
  border-color:rgba(255,255,255,.68)!important;
}
.club-badge:not(.club-badge--flag) b{
  display:grid!important;
  place-items:center!important;
  min-width:0!important;
  max-width:none!important;
  width:72%!important;
  height:48%!important;
  padding:0 3px!important;
  border-radius:7px!important;
  font-size:clamp(8px,1.05vw,13px)!important;
  letter-spacing:.015em!important;
  white-space:nowrap!important;
  overflow:visible!important;
  line-height:1!important;
}
.club-badge--sm:not(.club-badge--flag) b{font-size:9px!important;width:76%!important;height:50%!important}
.club-badge--md:not(.club-badge--flag) b{font-size:11px!important}
.club-badge--lg:not(.club-badge--flag) b{font-size:13px!important;width:76%!important;height:48%!important}

/* Açılır veri ve oyun rehberi. */
.data-guide{display:grid;gap:12px}
.data-guide section{
  padding:14px 15px;
  border:1px solid #dce9e0;
  border-radius:15px;
  background:linear-gradient(180deg,#fbfdfc,#f4f9f6);
}
.data-guide h4{margin:0 0 6px;color:#0a6541;font-size:13px;letter-spacing:-.01em}
.data-guide p{margin:0;color:#52655a;font-size:11px;line-height:1.65}
.data-guide__stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.data-guide__stats span{
  min-height:58px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:8px;
  border:1px solid #dce9e0;
  border-radius:13px;
  color:#64766c;
  background:#f7faf8;
  font-size:9px;
  text-align:center;
}
.data-guide__stats b{color:#0b6642;font-size:16px;line-height:1.1}
.data-guide__note{display:block;color:#718077;font-size:9px;line-height:1.55}

@media(max-width:900px){
  .topnav{gap:5px!important}
  .topnav button{padding:0 9px!important}
  .data-guide__stats{grid-template-columns:1fr!important}
  .round-team{background:linear-gradient(135deg,var(--team-primary,#176f48),var(--team-secondary,#b6d6c3))!important}
}


/* V35 — cevap alanını ferahlat, üç öneri satırını koru ve bilgi penceresini düzelt */
@media (min-width:1366px){
  /* Üst bölümlere dokunmadan cevap modülünü aşağıya doğru genişlet. */
  .app-shell.is-match-started .round-play-grid{
    grid-template-columns:142px minmax(0,1fr)!important;
    gap:10px!important;
    margin-top:10px!important;
    padding:11px!important;
    border-radius:16px!important;
    align-items:stretch!important;
  }
  .app-shell.is-match-started .round-player-choice{
    min-height:220px!important;
    padding:13px!important;
    border-radius:14px!important;
  }
  .app-shell.is-match-started .round-player-choice>span{
    font-size:9px!important;
    margin-bottom:8px!important;
  }
  .app-shell.is-match-started .solo-player-chip{
    min-height:46px!important;
    padding:0 12px!important;
    border-radius:12px!important;
    font-size:12px!important;
  }
  .app-shell.is-match-started .answer-area{
    min-height:220px!important;
    padding:13px!important;
    border-radius:15px!important;
  }
  .app-shell.is-match-started .answer-area>label{
    margin-bottom:7px!important;
    font-size:9px!important;
    letter-spacing:.12em!important;
  }
  .app-shell.is-match-started .answer-box{
    grid-template-columns:minmax(0,1fr) 138px 96px!important;
    gap:8px!important;
  }
  .app-shell.is-match-started .answer-box input{
    min-height:50px!important;
    padding:0 16px!important;
    border-radius:14px!important;
    font-size:15px!important;
  }
  .app-shell.is-match-started .answer-box>button{
    min-height:50px!important;
    padding:0 12px!important;
    border-radius:13px!important;
    font-size:12px!important;
  }
  .app-shell.is-match-started .player-suggestions{
    max-height:164px!important;
    overflow:auto!important;
    margin-top:8px!important;
    padding:9px!important;
    border-radius:14px!important;
  }
  .app-shell.is-match-started .player-suggestions__label{
    margin-bottom:6px!important;
    font-size:8px!important;
    letter-spacing:.12em!important;
  }
  .app-shell.is-match-started .player-suggestions__grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:6px!important;
  }
  .app-shell.is-match-started .player-suggestions button{
    min-height:40px!important;
    padding:6px 9px!important;
    gap:8px!important;
    border-radius:10px!important;
  }
  .app-shell.is-match-started .player-suggestion-flag{
    width:25px!important;
    height:25px!important;
    border-radius:6px!important;
  }
  .app-shell.is-match-started .player-suggestions button b{
    font-size:10px!important;
    line-height:1.1!important;
  }
  .app-shell.is-match-started .player-suggestions button small{
    font-size:8px!important;
    line-height:1.15!important;
  }
  /* Durum bilgilerini cevap alanından ayırıp daha aşağıda nefesli göster. */
  .app-shell.is-match-started .round-pass-status{
    margin-top:12px!important;
    gap:9px!important;
  }
  .app-shell.is-match-started .round-pass-status span{
    min-height:30px!important;
    padding:0 13px!important;
    font-size:10px!important;
  }
  .app-shell.is-match-started .round-arena .feedback{
    min-height:36px!important;
    margin-top:8px!important;
    padding:7px 12px!important;
    font-size:10px!important;
    border-radius:12px!important;
  }
}

/* Bilgi penceresi üst menünün altında kalmasın; kapatma düğmesi her zaman görünür olsun. */
.modal-backdrop{
  z-index:250000!important;
  align-items:flex-start!important;
  justify-items:center!important;
  overflow:auto!important;
  padding:82px 18px 24px!important;
  background:rgba(17,30,22,.68)!important;
  -webkit-backdrop-filter:blur(7px)!important;
  backdrop-filter:blur(7px)!important;
}
.modal-card{
  position:relative!important;
  width:min(570px,calc(100vw - 36px))!important;
  max-height:calc(100dvh - 106px)!important;
  overflow:auto!important;
  padding:20px!important;
  border-radius:22px!important;
  overscroll-behavior:contain!important;
}
.modal-card__head{
  position:sticky!important;
  top:-20px!important;
  z-index:4!important;
  margin:-20px -20px 14px!important;
  padding:20px 20px 13px!important;
  background:linear-gradient(180deg,#fff 78%,rgba(255,255,255,.94))!important;
  border-bottom:1px solid #e3ece6!important;
}
.modal-card__head h3{
  margin-top:4px!important;
  font-size:23px!important;
  line-height:1.1!important;
}
.modal-card__head button{
  flex:0 0 auto!important;
  display:grid!important;
  place-items:center!important;
  width:38px!important;
  height:38px!important;
  margin-left:14px!important;
  color:#0b6843!important;
  background:#edf7f1!important;
  border:1px solid #cfe5d8!important;
  border-radius:12px!important;
  font-size:24px!important;
  line-height:1!important;
  cursor:pointer!important;
}
.modal-card__head button:hover{background:#dff1e6!important}

@media (max-width:900px){
  .modal-backdrop{padding:68px 10px 16px!important}
  .modal-card{width:min(560px,calc(100vw - 20px))!important;max-height:calc(100dvh - 84px)!important;padding:16px!important}
  .modal-card__head{top:-16px!important;margin:-16px -16px 12px!important;padding:16px 16px 12px!important}
  .modal-card__head h3{font-size:20px!important}
}


/* V36 — Bilgi penceresi 100% görünümde kaydırmadan tam sığsın. */
.modal-backdrop:has(.data-guide){
  align-items:center!important;
  overflow:hidden!important;
  padding:14px!important;
}
.modal-card:has(.data-guide){
  width:min(620px,calc(100vw - 28px))!important;
  max-height:calc(100dvh - 28px)!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
  padding:15px!important;
  border-radius:20px!important;
}
.modal-card:has(.data-guide) .modal-card__head{
  position:relative!important;
  top:auto!important;
  flex:0 0 auto!important;
  margin:-15px -15px 9px!important;
  padding:14px 15px 10px!important;
  background:#fff!important;
}
.modal-card:has(.data-guide) .modal-card__head span{
  font-size:8px!important;
  letter-spacing:.16em!important;
}
.modal-card:has(.data-guide) .modal-card__head h3{
  margin-top:3px!important;
  font-size:21px!important;
  line-height:1.05!important;
}
.modal-card:has(.data-guide) .modal-card__head button{
  width:36px!important;
  height:36px!important;
  margin-left:10px!important;
  border-radius:11px!important;
  font-size:22px!important;
}
.modal-card:has(.data-guide) .data-guide{
  flex:1 1 auto!important;
  min-height:0!important;
  display:grid!important;
  gap:7px!important;
  overflow:hidden!important;
}
.modal-card:has(.data-guide) .data-guide section{
  padding:9px 11px!important;
  border-radius:13px!important;
}
.modal-card:has(.data-guide) .data-guide h4{
  margin:0 0 3px!important;
  font-size:11px!important;
  line-height:1.15!important;
}
.modal-card:has(.data-guide) .data-guide p{
  font-size:9.5px!important;
  line-height:1.38!important;
}
.modal-card:has(.data-guide) .data-guide__stats{
  gap:6px!important;
}
.modal-card:has(.data-guide) .data-guide__stats span{
  min-height:46px!important;
  padding:7px 8px!important;
  border-radius:11px!important;
  font-size:8px!important;
}
.modal-card:has(.data-guide) .data-guide__stats b{
  font-size:14px!important;
}
.modal-card:has(.data-guide) .data-guide__note{
  font-size:7.5px!important;
  line-height:1.3!important;
}
.modal-card:has(.data-guide) .modal-button{
  flex:0 0 auto!important;
  min-height:42px!important;
  margin-top:8px!important;
  border-radius:12px!important;
  font-size:14px!important;
}

@media (max-height:760px) and (min-width:901px){
  .modal-card:has(.data-guide){
    width:min(650px,calc(100vw - 24px))!important;
    max-height:calc(100dvh - 18px)!important;
    padding:12px!important;
  }
  .modal-card:has(.data-guide) .modal-card__head{
    margin:-12px -12px 7px!important;
    padding:11px 12px 8px!important;
  }
  .modal-card:has(.data-guide) .modal-card__head h3{font-size:19px!important}
  .modal-card:has(.data-guide) .data-guide{gap:5px!important}
  .modal-card:has(.data-guide) .data-guide section{padding:7px 9px!important}
  .modal-card:has(.data-guide) .data-guide p{font-size:8.7px!important;line-height:1.3!important}
  .modal-card:has(.data-guide) .data-guide__stats span{min-height:40px!important;padding:5px 7px!important}
  .modal-card:has(.data-guide) .data-guide__note{font-size:7px!important}
  .modal-card:has(.data-guide) .modal-button{min-height:38px!important;margin-top:6px!important}
}

@media (max-width:900px){
  .modal-backdrop:has(.data-guide){padding:8px!important}
  .modal-card:has(.data-guide){
    width:calc(100vw - 16px)!important;
    max-height:calc(100dvh - 16px)!important;
    overflow:auto!important;
    padding:12px!important;
  }
  .modal-card:has(.data-guide) .modal-card__head{
    position:sticky!important;
    top:-12px!important;
    margin:-12px -12px 8px!important;
    padding:12px 12px 9px!important;
  }
  .modal-card:has(.data-guide) .data-guide{overflow:visible!important}
  .modal-card:has(.data-guide) .data-guide__stats{grid-template-columns:repeat(3,1fr)!important}
  .modal-card:has(.data-guide) .modal-button{
    position:sticky!important;
    bottom:-12px!important;
    z-index:3!important;
    box-shadow:0 -8px 18px rgba(255,255,255,.92)!important;
  }
}