.mms-game{max-width:980px;margin:2rem auto;padding:1rem;border:1px solid #d8d8d8;border-radius:16px;background:#f7f5ef;box-shadow:0 8px 28px rgba(0,0,0,.08);box-sizing:border-box}
.mms-game *{box-sizing:border-box}
/* Zustandsabhängige Bedienelemente müssen trotz eigener display-Regeln wirklich verborgen bleiben. */
.mms-game [hidden]{display:none!important}
.mms-toolbar,.mms-call-box{display:flex;gap:.75rem;align-items:center;flex-wrap:wrap}
.mms-toolbar{justify-content:space-between;margin-bottom:1rem}.mms-toolbar label{display:flex;gap:.5rem;align-items:center;}.mms-toolbar select{padding:.5rem .65rem;}
.mms-button{border:0;border-radius:9px;padding:.72rem 1rem;background:#1f4f3f;color:#fff;cursor:pointer;}.mms-button:hover{filter:brightness(1.08)}.mms-button:disabled{opacity:.45;cursor:not-allowed}
.mms-status{min-height:2.75rem;padding:.7rem .85rem;margin-bottom:.8rem;border-radius:10px;background:#fff;border:1px solid #e5e0d7;}
.mms-round-state{margin:0 0 .8rem;padding:.55rem .75rem;border-radius:9px;background:#fff4cf;border:1px solid #dfbd59;text-align:center}
.mms-opponents{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.8rem;margin-bottom:.8rem}.mms-opponent{padding:.8rem;border-radius:12px;background:#e9efe9}.mms-opponent h3{margin:0 0 .5rem}.mms-opponent-hand{display:flex;gap:.2rem;min-height:82px;align-items:center;overflow:hidden;padding-left:1px}
.mms-table{display:flex;justify-content:center;gap:2rem;align-items:flex-start;padding:1rem;border-radius:14px;background:#487d5f;margin-bottom:.8rem}.mms-pile-wrap{text-align:center;color:#fff}.mms-label{margin-bottom:.4rem;}.mms-count{margin-top:.35rem}
.mms-card{width:78px;height:112px;border-radius:10px;border:1px solid #888;background:#fff;display:inline-flex;align-items:center;justify-content:center;position:relative;font-size:1.2rem;font-weight:800;box-shadow:0 2px 7px rgba(0,0,0,.2);user-select:none;flex:0 0 auto;padding:0}
.mms-card-playable{cursor:pointer;transform:translateY(-4px);outline:3px solid rgba(255,255,255,.88)}.mms-card-playable:hover,.mms-card-playable:focus-visible{transform:translateY(-10px);outline-color:#ffcf44}
.mms-card-back{background:#17365a center/cover no-repeat;border:3px solid #f4e1ad;cursor:pointer}.mms-opponent-hand .mms-card-back{width:50px;height:72px;margin-left:-18px}.mms-opponent-hand .mms-card-back:first-child{margin-left:0}
.mms-card.red{color:#b51f2e}.mms-card.black{color:#161616}.mms-card .mms-corner{position:absolute;left:6px;top:5px;font-size:.82rem;line-height:1}.mms-card .mms-corner.bottom{left:auto;top:auto;right:6px;bottom:5px;transform:rotate(180deg)}
.mms-call-box{justify-content:center;margin:.8rem 0}.mms-call{min-width:130px;background:#8a5a18}.mms-call-active{background:#b36a00;box-shadow:0 0 0 3px rgba(255,197,74,.45)}
.mms-suit-choice{display:flex;justify-content:center;gap:.5rem;flex-wrap:wrap;padding:.75rem;margin:.4rem 0 .8rem;background:#fff;border:1px solid #ddd4c7;border-radius:10px}.mms-suit-choice strong{width:100%;text-align:center}.mms-suit-button{min-width:72px}.mms-suit-button.red{background:#a52232}.mms-suit-button.black{background:#262626}
.mms-pass-wrap{text-align:center;margin:-.2rem 0 .8rem}.mms-pass{background:#59636c}
.mms-player{padding:.9rem;border-radius:12px;background:#fff}.mms-player h3{margin:0 0 .65rem}.mms-hand{display:flex;gap:.45rem;flex-wrap:wrap;align-items:flex-end;min-height:124px}
.mms-rules{margin-top:1rem;border:1px solid #d6d0c6;border-radius:11px;background:#fff;overflow:hidden}.mms-rules summary{cursor:pointer;padding:.85rem 1rem;background:#f0ede6;min-height:48px;display:flex;align-items:center}.mms-rules-content{padding:.8rem 1rem 1rem;}.mms-rules-content ul{margin:.4rem 0 0 1.2rem;padding:0}.mms-rules-content li{margin:.35rem 0}
.mms-winner{background:#e7f6e7;border-color:#89c989}.mms-loser{background:#f9e4e4;border-color:#d68d8d}
.mms-card-art{background-color:#fff;background-position:center;background-repeat:no-repeat;background-size:cover;overflow:hidden}.mms-card-number{background:#fff}.mms-number-center{font-size:2.2rem;line-height:1}.mms-rank-badge{position:absolute;left:4px;top:4px;min-width:19px;height:19px;padding:0 3px;border-radius:5px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.94);color:#111;border:1px solid rgba(0,0,0,.25);font-size:.74rem;line-height:1;font-weight:800;box-shadow:0 1px 2px rgba(0,0,0,.18)}

@media (max-width:640px){
  .mms-game{margin:.4rem 0;padding:.7rem;border-radius:12px}
  .mms-toolbar{gap:.55rem}.mms-toolbar label{}.mms-toolbar .mms-button{margin-left:auto}
  .mms-status{margin-bottom:.6rem}
  .mms-opponents{gap:.5rem;margin-bottom:.55rem}.mms-opponent{padding:.6rem}.mms-opponent h3{margin-bottom:.35rem}.mms-opponent-hand{min-height:76px}
  .mms-opponent-hand .mms-card-back{width:48px;height:70px;margin-left:-20px}
  .mms-table{gap:1.2rem;padding:.75rem;margin-bottom:.55rem}
  .mms-table .mms-card{width:88px;height:126px}
  .mms-label{}.mms-count{}
  .mms-call-box{gap:.5rem;margin:.6rem 0}.mms-call{min-width:0;flex:1;padding:.7rem .55rem}
  .mms-player{padding:.7rem}
  .mms-hand{flex-wrap:nowrap;overflow-x:auto;overflow-y:visible;gap:.35rem;min-height:140px;padding:10px 3px 8px;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
  .mms-hand .mms-card{width:88px;height:126px}
  .mms-hand .mms-card-playable{transform:translateY(-5px)}
  .mms-number-center{font-size:2.5rem}.mms-card .mms-corner{font-size:.9rem}
  .mms-rules{margin-top:.75rem}.mms-rules summary{padding:.8rem}.mms-rules-content{padding:.7rem .85rem .9rem}
}


/* 0.14.4: größere Karten und kompakter Spieltisch ohne unnötigen Zwischenraum. */
.mms-table{display:grid;justify-items:center;gap:.8rem;padding:1rem;margin-bottom:.8rem}
.mms-piles{display:flex;justify-content:center;align-items:flex-start;gap:2.25rem;width:100%}
.mms-table .mms-call-box{margin:0;justify-content:center}
.mms-table .mms-card{width:112px;height:160px}
.mms-hand{gap:.6rem;min-height:160px}
.mms-hand .mms-card{width:104px;height:149px}
.mms-card .mms-corner{font-size:1rem}
.mms-number-center{font-size:2.8rem}
@media (max-width:640px){
  .mms-table{gap:.65rem;padding:.7rem}
  .mms-piles{gap:1rem}
  .mms-table .mms-card{width:106px;height:152px}
  .mms-table .mms-call-box{width:100%}
  .mms-hand{min-height:160px;gap:.4rem}
  .mms-hand .mms-card{width:104px;height:149px}
  .mms-card .mms-corner{font-size:1rem}
  .mms-number-center{font-size:2.8rem}
}


/* 0.14.6: komplette WebP-Karten, größere Darstellung und sichere Kartenränder. */
.mms-card-webp{
  background-color:#fff;
  background-position:center;
  background-repeat:no-repeat;
  background-size:100% 100%;
  overflow:hidden;
}
.mms-table .mms-card{width:132px;height:188px}
.mms-hand{min-height:188px;padding:8px 8px 10px}
.mms-hand .mms-card{width:120px;height:171px}
.mms-hand .mms-card-playable{transform:translateY(-4px)}
.mms-hand .mms-card-playable:hover,.mms-hand .mms-card-playable:focus-visible{transform:translateY(-8px)}
@media (max-width:640px){
  .mms-table .mms-card{width:118px;height:169px}
  .mms-hand{min-height:174px;padding:10px 8px 10px}
  .mms-hand .mms-card{width:112px;height:160px}
}


/* 0.14.10: responsive Kartenhand als Fächer mit mindestens 1/3 sichtbarer Karte. */
.mms-hand{
  --mms-hand-overlap:0px;
  flex-wrap:nowrap;
  align-items:flex-end;
  gap:0;
  overflow-x:visible;
  overflow-y:visible;
  padding:18px 14px 20px;
}
.mms-hand .mms-card{
  margin-left:calc(-1 * var(--mms-hand-overlap));
  transform-origin:50% 115%;
  transform:translateY(var(--mms-fan-y,0px)) rotate(var(--mms-fan-angle,0deg));
  transition:none;
}
.mms-hand .mms-card:first-child{margin-left:0}
.mms-hand .mms-card-playable{
  transform:translateY(calc(var(--mms-fan-y,0px) - 5px)) rotate(var(--mms-fan-angle,0deg));
}
.mms-hand .mms-card-playable:hover,
.mms-hand .mms-card-playable:focus-visible{
  transform:translateY(calc(var(--mms-fan-y,0px) - 10px)) rotate(var(--mms-fan-angle,0deg));
  z-index:100!important;
}
.mms-hand.mms-hand-scroll{
  overflow-x:auto;
  overflow-y:visible;
  scrollbar-width:thin;
  -webkit-overflow-scrolling:touch;
}
@media (max-width:640px){
  .mms-hand{padding:18px 8px 20px;overflow-x:visible}
  .mms-hand.mms-hand-scroll{overflow-x:auto}
}

/* 0.14.12: Spielstatus unmittelbar am Kartentisch statt im Kopfbereich. */
.mms-table-status{
  width:min(100%,680px);
  display:grid;
  gap:.45rem;
  margin:0;
}
.mms-table .mms-status{
  width:100%;
  min-height:0;
  margin:0;
  padding:.7rem .9rem;
  text-align:center;
  background:rgba(255,255,255,.96);
  border-color:rgba(255,255,255,.78);
}
.mms-table .mms-round-state{
  width:100%;
  margin:0;
  padding:.6rem .8rem;
}
.mms-table .mms-status.mms-winner{
  background:#e7f6e7;
  border-color:#89c989;
}
.mms-table .mms-status.mms-loser{
  background:#f9e4e4;
  border-color:#d68d8d;
}
@media (max-width:640px){
  .mms-table-status{width:100%;gap:.4rem}
  .mms-table .mms-status{padding:.65rem .7rem}
  .mms-table .mms-round-state{padding:.55rem .65rem}
}

/* 0.14.13: Fernspiel-Setup und Gastansicht. */
.mms-remote-setup{display:flex;gap:.7rem;align-items:end;flex-wrap:wrap;width:100%;padding:.75rem;border:1px solid #d8d2c6;border-radius:10px;background:#fff}
.mms-remote-setup label{display:grid;gap:.3rem;min-width:145px;flex:1}
.mms-remote-setup input,.mms-remote-setup select{width:100%;padding:.55rem .6rem;border:1px solid #bbb;border-radius:8px;background:#fff}
.mms-remote-info{margin:0 0 .8rem;padding:.65rem .8rem;border:1px solid #c9d8cd;border-radius:10px;background:#f2f8f3}
.mms-remote-info a{overflow-wrap:anywhere}
.mms-remote-guest .mms-toolbar{display:none!important}
@media(max-width:640px){.mms-remote-setup{display:grid;grid-template-columns:1fr}.mms-remote-setup label{min-width:0}}


/* 0.14.19: Gewinnaktionen am Spieltisch und größere Karten im mobilen Hochformat. */
.mms-table-new-game-wrap{width:min(100%,680px);display:flex;justify-content:center}
.mms-table-new-game{min-width:min(100%,240px);background:#1f4f3f}
.mms-remote-guest .mms-table-new-game-wrap{display:none!important}
.mms-call:disabled,.mms-button:disabled{filter:none;text-decoration:none}
.mms-call:disabled:hover,.mms-call:disabled:focus,.mms-button:disabled:hover,.mms-button:disabled:focus{filter:none;text-decoration:none}
@media (max-width:640px) and (orientation:portrait){
  .mms-piles{gap:.8rem}
  .mms-table .mms-card{width:136px;height:194px}
}


/* 0.14.26: Konfiguration und Spielansicht getrennt; Status unter dem Spieltisch. */
.mms-setup-panel[hidden],.mms-play-panel[hidden]{display:none!important}
.mms-setup-panel .mms-toolbar{margin-bottom:0}
.mms-play-status{
  min-height:3.2em;
  margin:.45rem .15rem .35rem;
  padding:0;
  display:grid;
  align-content:center;
  gap:.1rem;
}
.mms-play-status .mms-status,
.mms-play-status .mms-round-state{
  min-height:0;
  margin:0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  text-align:left;
  color:inherit;
}
.mms-play-status .mms-status.mms-winner,
.mms-play-status .mms-status.mms-loser{
  background:transparent;
  border:0;
}
@media (max-width:640px){
  .mms-play-status{min-height:3.8em;margin:.35rem .1rem .25rem}
}

.mms-setup-status{min-height:1.5em;margin-top:.45rem}


/* 0.14.29: kompakte Statuszeile im Spieltisch; keine Deck-Anzahl und kein hoher Textblock. */
.mms-compact-status{
  width:min(100%,760px);
  min-height:1.45em;
  margin:.05rem 0;
  padding:0;
  color:#fff;
  text-align:center;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.mms-status-flash{animation:mmsStatusFlash .22s ease-out 1}
@keyframes mmsStatusFlash{from{opacity:.35}to{opacity:1}}
.mms-play-status,.mms-round-state,.mms-count{display:none!important}
@media (max-width:640px){
  .mms-compact-status{width:100%;min-height:1.45em;margin:0;white-space:nowrap}
}

/* 0.14.41: Spielende zuverlässig sichtbar und Gewinnerstatus kontrastreich. */
.mms-table-new-game-wrap[hidden]{display:none!important}
.mms-table .mms-status.mms-winner{background:#dff4df;border-color:#2f7d32;color:#173f19}
.mms-table .mms-status.mms-loser{background:#f3d7d7;border-color:#9b3d3d;color:#5e1717}
.mms-compact-status.mms-winner{background:#dff4df!important;border:2px solid #2f7d32!important;color:#173f19!important}
.mms-compact-status.mms-loser{background:#f3d7d7!important;border:2px solid #9b3d3d!important;color:#5e1717!important}