/* Times salvos no topo da janela Equipe (client/saved-teams.mjs). */
.teamwin { width: min(1000px, 96vw); height: min(760px, 94vh); }
.teamwin .wbody { position: relative; }

.tsaved { display: grid; gap: 8px; }
.tshead { display: flex; align-items: center; gap: 10px; }
.tshead .label { margin: 0; }
.tshead .small { flex: 1; }
.tsgrid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; padding-top: 6px; }

.tscard { position: relative; padding: 8px; border-radius: 12px; background: linear-gradient(#13212e, #0b151e); border: 1px solid #1f3446; display: grid; gap: 6px; align-content: start; min-height: 150px; }
.tscard.on { border-color: #4f9a62; box-shadow: 0 0 0 1px rgb(79 154 98 / 35%), 0 0 16px rgb(79 154 98 / 16%); }
.tscard.stored { opacity: .75; }
.tscard.empty, .tscard.lock { place-items: center; align-content: center; text-align: center; border-style: dashed; }
.tscard.lock { background: linear-gradient(#141422, #0c0c16); }
.tscard.viplock { border-color: #6d5520; background: linear-gradient(#211c10, #0f0d08); }
.tstag { position: absolute; top: -9px; right: 10px; padding: 1px 6px; border-radius: 4px; font: 800 9.5px/1.5 "Segoe UI", sans-serif; letter-spacing: .05em; }
.tstag.use { color: #d6ffe2; background: #2c6a3e; }
.tstag.vip { color: #1a1205; background: linear-gradient(#ffe7a3, #e8c872); }
.tstop { display: flex; align-items: center; gap: 6px; min-width: 0; }
.tstop b { flex: 1; min-width: 0; font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tsnum { flex: none; width: 20px; height: 20px; border-radius: 6px; display: grid; place-items: center; font: 800 11px "Segoe UI", sans-serif; background: #0a141c; border: 1px solid #2f5468; color: #9fb0bd; }
.tspen { flex: none; width: 22px; height: 22px; display: grid; place-items: center; border-radius: 6px; color: #9fb0bd; cursor: pointer; }
.tspen:hover { color: #ffe7a3; background: rgb(232 200 114 / 10%); }
.tspen svg, .tslk svg { width: 14px; height: 14px; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.tsname { flex: 1; min-width: 0; height: 22px; padding: 0 6px; border-radius: 6px; border: 1px solid #a8873a; background: #0a141c; color: #fff; font: 700 12.5px "Segoe UI", sans-serif; }
.tsmons { display: grid; grid-template-columns: repeat(var(--n, 6), minmax(0, 1fr)); gap: 3px; }
.tsmon { position: relative; aspect-ratio: 1; min-width: 0; overflow: hidden; border-radius: 7px; background: #0a141c; border: 1px solid #1a2c3a; display: grid; place-items: center; color: #c98080; font-weight: 800; }
.tsmon canvas { width: 100%; height: 100%; image-rendering: pixelated; }
.tsmon.lead { border-color: #a8873a; background: radial-gradient(circle, #2a2312, #0a141c 70%); }
.tsmon.lead::after { content: "★"; position: absolute; right: 1px; top: -3px; font-size: 10px; color: #ffe7a3; text-shadow: 0 0 4px #000; }
.tsmon.fainted canvas { opacity: .4; filter: grayscale(1); }
.tsmon.gone { border-style: dashed; border-color: #6a3a3a; }
.tsmon.empty { border-style: dashed; opacity: .5; }
.tsmeta { display: flex; justify-content: space-between; gap: 6px; font-size: 11px; color: #9fb0bd; }
.tsbtns { display: flex; gap: 6px; }
.tsbtns button { flex: 1; min-height: 28px; padding: 2px 6px; font-size: 12px; white-space: nowrap; }
.tsaved button.tsgo, .tsdlg button.tsgo { background: linear-gradient(#3f8a52, #2c6a3e); color: #eaffef; border-color: #6fc285; }
.tsaved button.tsover { flex: 0 0 32px; }
.tsaved button.tsoff { color: #6f8494; background: #13202b; border: 1px dashed #3a4858; cursor: not-allowed; }
.tslk { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; background: #1a1a2c; border: 1px solid #3a3a5a; color: #b9a6e6; }
.viplock .tslk { background: #2a2312; border-color: #6d5520; color: #ffe7a3; }
.tscard.empty .small, .tscard.lock .small { font-size: 11px; }

.tsscrim { position: absolute; inset: 0; z-index: 5; display: grid; place-items: center; background: rgb(3 7 11 / 62%); }
.tsdlg { width: min(560px, 92%); padding: 14px 16px; border-radius: 14px; display: grid; gap: 10px;
  background: linear-gradient(170deg, #12212d, #0b1620); border: 1px solid #3c6a80; box-shadow: 0 30px 80px rgb(0 0 0 / 80%); }
.tsdlg h3 { margin: 0; display: flex; align-items: center; gap: 10px; font: 600 17px Georgia, serif; font-variant: small-caps; letter-spacing: .05em; color: #ffe7a3; }
.tsflow { display: grid; grid-template-columns: 1fr 30px 1fr; gap: 8px; align-items: center; }
.tscol { padding: 8px; border-radius: 10px; background: #0a141c; border: 1px solid #1f3446; display: grid; gap: 6px; }
.tscol > span { font: 800 10.5px "Segoe UI", sans-serif; letter-spacing: .06em; color: #9fb0bd; text-transform: uppercase; }
.tscol .tsmons { --n: 3; }
.tsarrow { text-align: center; font-size: 22px; color: #e8c872; }
.tswarn { padding: 8px 10px; border-radius: 10px; background: rgb(201 128 128 / 10%); border: 1px solid #6a3a3a; font-size: 12px; color: #f0c6c6; }

@media (max-width: 900px) {
  .tsgrid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}