/* Steg 3 · Efter budgivning · Del A: Bordet och rollerna */
.play-exercise .progress{width:100%;margin:18px 0 22px}
.play-exercise h1{margin-bottom:8px}
.play-exercise .small{margin:0 0 14px}
.play-chip,.play-call{display:inline-block;background:#fff;color:#111;border-radius:7px;padding:3px 9px;font-weight:700;line-height:1.4}
.play-call.pass{background:#ffffff33;color:#fff;font-weight:400}
.play-auction{border-collapse:separate;border-spacing:6px 6px;margin:4px auto 10px;text-align:center}
.play-auction th{font-size:13px;font-weight:700;color:#d9f2d9;padding:0 4px}
.play-auction td{min-width:58px;height:30px}
.play-table{display:grid;grid-template-columns:1fr auto 1fr;grid-template-areas:". n ." "w c e" ". s .";gap:10px 14px;justify-items:center;align-items:center;max-width:560px;margin:8px auto 4px}
.play-seat-N{grid-area:n}.play-seat-W{grid-area:w}.play-seat-E{grid-area:e}.play-seat-S{grid-area:s}.play-center{grid-area:c;text-align:center}
.play-center-label{display:block;font-size:13px;color:#d9f2d9;margin-bottom:4px}
.play-seat{display:flex;flex-direction:column;align-items:center;gap:6px;min-width:96px;padding:10px 12px;border:2px solid #ffffff80;border-radius:14px;background:#ffffff12;color:#fff;cursor:pointer}
.play-seat:hover:not(:disabled){background:#ffffff26;border-color:#fff}
.play-seat:disabled{cursor:default}
.play-seat.is-right{border-color:#a7ffa7;background:#2d5a3d}
.play-seat.is-wrong{border-color:#ff9c9c;background:#7a2f2f40}
.play-seat-name{font-size:16px}
.badge{padding:2px 10px;border-radius:999px;background:#fff;color:#005d35;font-size:12px}
.backs{display:flex;pointer-events:none}
.backs.v{flex-direction:column;align-items:center}
.card-back{display:block;flex:0 0 auto;width:18px;height:27px;border:1.5px solid #fff;border-radius:3px;background:repeating-linear-gradient(45deg,#1d4f91 0 3px,#163f75 3px 6px)}
.backs.h .card-back:not(:last-child){margin-right:-11px}
.backs.v .card-back:not(:last-child){margin-bottom:-19px}
#play-feedback{font-size:19px;line-height:1.55;margin:14px 0;max-width:640px}
.play-answers{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;max-width:520px;margin:10px 0 4px}
.play-answers .opening-bid{min-height:54px}
.play-answers .any{font-size:15px}
.role-chip{display:inline-block;background:#ffffff26;border-radius:999px;padding:3px 12px;font-size:13px;margin-bottom:8px}
.play-persp{max-width:640px;margin:14px auto;display:grid;gap:14px}
.persp-dummy{text-align:center}
.dummy-cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;max-width:520px;margin:0 auto;align-items:start}
.dummy-col{display:flex;flex-direction:column;align-items:stretch;min-width:0;padding:4px;border-radius:10px;border:2px solid transparent}
.dummy-col.trumpcol{border-color:#fff;background:#ffffff14}
.col-head{text-align:center;font-size:18px;margin-bottom:4px}
.play-exercise .dummy-col .card{position:relative;width:100%;flex:none;aspect-ratio:auto;border:0;border-radius:0;background:transparent;overflow:visible;margin:0}
.play-exercise .dummy-col .card+.card{margin-top:-118%}
.play-exercise .dummy-col .card img{display:block;width:100%;height:auto;object-fit:contain;transform:none}
.persp-mid{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px}
.persp-def{display:flex;flex-direction:column;align-items:center}
.persp-note{text-align:center;color:#d9f2d9;font-size:14px;margin:0}
.persp-decl{text-align:center}
.persp-decl .honor-hand{margin:8px auto}
.play-role{display:flex;gap:12px;margin:10px 0;align-items:flex-start}
.play-role .role-chip{flex:0 0 auto;margin:0;white-space:nowrap}
.play-box{margin:8px 0;padding:8px 12px;border-left:4px solid #ffffffb0;background:#ffffff14;border-radius:0 8px 8px 0}
@media(max-width:480px){
.play-seat{min-width:84px;padding:8px 8px}
.play-seat-name{font-size:15px}
.play-table{gap:8px 8px}
.dummy-cols{gap:6px}
.play-answers{gap:6px}
}

/* Del B · Utspel */
.play-turn{border-collapse:collapse;margin:10px 0;width:100%;max-width:420px}
.play-turn th,.play-turn td{text-align:left;padding:6px 10px;border-bottom:1px solid #ffffff40}
.play-turn th{font-size:14px;color:#d9f2d9}
.lead-group{margin:18px 0 8px}
.lead-exercise .honor-hand{margin:18px auto}
.lead-pick .card{cursor:pointer}
.lead-pick .card:hover{transform:translateY(-6px)}
.lead-pick .card.pick-right,.lead-pick .card.pick-wrong{z-index:3;outline-offset:-3px;border-radius:8px}
.lead-pick .card.pick-right{outline:5px solid #a7ffa7}
.lead-pick .card.pick-wrong{outline:5px solid #ff8b8b}
.lead-held{max-width:360px}
.lead-held .card{flex:0 0 calc(100% / 3.4)!important;width:calc(100% / 3.4)!important}
.lead-held .card:not(:last-child){margin-right:calc(-100% / 7)!important}
.lead-led,.lead-hold{text-align:center}
.lead-led .honor-hand{max-width:100px}
.lead-led .honor-hand .card{flex:0 0 100%!important;width:100%!important}
.lead-none-row{text-align:center;margin:6px 0}
.lead-none{min-width:200px}
.lead-none.is-right{background:#e8ffbf;color:#194500;border-color:#c7f67d}
.lead-none.is-wrong{background:#ffe3e1;color:#8e1b15;border-color:#ffbdb7}
.play-rule{display:flex;gap:12px;align-items:flex-start;margin:10px 0}
.play-rule-nr{flex:0 0 auto;width:28px;height:28px;border-radius:50%;background:#fff;color:#005d35;display:inline-flex;align-items:center;justify-content:center;font-size:15px}
.play-rule>span:last-child{line-height:1.5}

/* Del C · Spelföraren */
.plan-table{max-width:560px;margin:10px auto 6px}
.plan-hand{text-align:center}
.plan-hand .role-chip{margin:6px 0}
.plan-cols{max-width:400px}
.plan-col{padding:2px}
.col-head.red{color:#ffb4b4}
.plan-card{display:block;width:100%;padding:0;margin:0;border:0;background:transparent;font:inherit;position:relative;border-radius:6px}
.plan-col .plan-card+.plan-card{margin-top:-118%}
.plan-col .card{position:relative;width:100%;flex:none;aspect-ratio:auto;border:0;border-radius:0;background:transparent;overflow:visible;margin:0}
.plan-col .card img{display:block;width:100%;height:auto;object-fit:contain;transform:none}
.plan-card.can{cursor:pointer}
.plan-card.can:hover,.plan-card.can:focus-visible{transform:translateY(-6px);z-index:3}
.plan-card.dim{filter:brightness(.72);cursor:default}
.plan-card.bad{filter:brightness(.55);cursor:not-allowed}
.plan-mid{display:grid;grid-template-columns:1fr auto 1fr;gap:8px;align-items:center;margin:10px 0}
.plan-side{display:flex;flex-direction:column;align-items:center;gap:4px;min-height:60px}
.plan-side .role-chip{margin:0;font-size:12px;white-space:nowrap}
.plan-side .backs.v .card-back{width:15px;height:22px}
.plan-side .backs.v .card-back:not(:last-child){margin-bottom:-15px}
.plan-trick{display:grid;grid-template-columns:repeat(3,52px);grid-template-rows:repeat(3,58px);justify-items:center;align-items:start;min-height:174px}
.tp-N{grid-column:2;grid-row:1}.tp-W{grid-column:1;grid-row:2}.tp-E{grid-column:3;grid-row:2}.tp-S{grid-column:2;grid-row:3}
.tcard{display:block;width:52px}
.tcard .card{width:100%;aspect-ratio:auto;border:0;border-radius:0;background:transparent;overflow:visible}
.tcard .card img{display:block;width:100%;height:auto;object-fit:contain;transform:none}
.tcard.won{outline:3px solid #a7ffa7;border-radius:6px;outline-offset:1px}
.plan-lost{margin:6px 0 14px;padding-left:20px;line-height:1.7}
#plan-end h2{margin-top:10px}
#plan-description{max-width:640px}
@media(max-width:480px){
.plan-trick{grid-template-columns:repeat(3,46px);grid-template-rows:repeat(3,52px);min-height:158px}
.tcard{width:46px}
.plan-side .role-chip{padding:3px 8px}
}
.plan-void{display:block;text-align:center;opacity:.6;font-size:20px;margin-top:8px}