/* Keep plans next to the table, with the same complete creature illustrations. */
.turn-plan{display:flex;align-items:center;justify-content:space-between;gap:8px;border-bottom:1px solid #9da982;padding:5px 0 8px;font-size:12px;line-height:1.3}
.turn-plan b{font:700 23px/1 var(--f-hand);white-space:nowrap}.turn-plan span{text-align:right;max-width:72%}
.attack-outlook{grid-column:1/-1;font:800 12px/1.3 var(--f);border-top:1px solid #9a735a55;padding-top:5px;margin-top:4px;color:#333c2b}
.outlook-note{font:500 11px/1.4 var(--f);color:#46543f;margin:0 2px}.bt .atk b{overflow-wrap:anywhere}.bt .atk>span:first-child{min-width:0}
.bt{overflow-y:auto}.bt .mid{flex:none;min-height:64px}.bt .atk:focus-visible{outline:3px solid #397c72;outline-offset:3px}
@media(min-width:960px){
 #app:has(.bt){max-width:1080px}
 .bt{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr);grid-template-rows:54px minmax(190px,1fr) 62px minmax(190px,1fr);gap:8px 30px;padding:12px 28px 20px}
 .bt .btop{grid-column:1/-1;grid-row:1}.bt .srow.top{grid-column:1;grid-row:2}.bt .mid{grid-column:1;grid-row:3}.bt .srow.bot{grid-column:1;grid-row:4}
 .bt .acts{grid-column:2;grid-row:2/5;align-self:center;gap:12px;background:#f9f6e8;padding:22px;border:2px solid #6c7958;border-radius:10px 22px 10px 22px;box-shadow:5px 6px #46563c33}
 .bt .cc.b{--w:154px}.bt .cc.m{--w:62px}.bt .atk{min-height:100px}.bt .hrow{min-height:92px}.bt .turn-plan{display:block}.bt .turn-plan span{display:block;text-align:left;max-width:none;margin-top:8px}
}
@media(min-width:700px) and (max-height:520px){
 #app:has(.bt){max-width:1100px}
 .bt{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(280px,1.2fr);grid-template-rows:48px minmax(0,1fr) 44px;gap:5px 12px;padding:5px 12px 8px}
 .bt .btop{grid-column:1/-1;grid-row:1}.bt .srow.top{grid-column:1;grid-row:2}.bt .srow.bot{grid-column:2;grid-row:2}.bt .mid{grid-column:1/3;grid-row:3;min-height:0;flex-direction:row;gap:8px}.bt .mid .modchip{margin:0}.bt .mid .msg{font-size:20px}
 .bt .srow{grid-template-columns:minmax(0,1fr) 48px;gap:6px}.bt .srow .aslot{grid-column:1;grid-row:1;justify-self:center}.bt .bench{grid-column:2;grid-row:1;gap:6px}.bt .lcol{grid-column:1/-1;grid-row:2;justify-self:center;flex-direction:row;gap:10px}.bt .trk{border:0;padding:0;background:transparent;font-size:16px;width:auto;flex-direction:row;gap:4px}.bt .trk small{font-size:10px;max-width:50px}
 .bt .cc.b{--w:130px}.bt .cc.m{--w:46px}.bt .tdots i{width:10px;height:10px}
 .bt .acts{grid-column:3;grid-row:2/4;align-self:start;gap:5px;margin:0;padding:0;border:0;background:none;box-shadow:none}
 .bt .turn-plan{padding:0 0 4px;display:flex}.bt .turn-plan b{font-size:20px}.bt .turn-plan span{font-size:10px;max-width:70%;text-align:right;margin:0}
 .bt .hrow{min-height:52px}.bt .atk{min-height:69px;padding:6px 9px}.bt .atk b{font-size:22px}.bt .atk small{font-size:10px}.bt .attack-outlook{font-size:11px;padding-top:3px;margin-top:2px}.bt .atk .dm{font-size:30px}.bt .outlook-note{font-size:10px}.bt .swapb{min-height:44px;font-size:22px}
 .bt .tcard{min-height:44px}
}
@media(prefers-reduced-motion:no-preference){.turn-plan{animation:turn-ready .2s ease-out}@keyframes turn-ready{from{opacity:.5;transform:translateY(3px)}to{opacity:1;transform:none}}}
@media(max-width:699px){
 .bt .cc.b{--w:150px}.bt .cc.m{--w:52px}.bt .mid{min-height:48px;flex-direction:row;flex-wrap:wrap;gap:6px;padding:6px 0}.bt .mid .modchip{margin:0}.bt .mid .msg{font-size:23px}.bt .turn-plan{gap:12px}.bt .turn-plan span{max-width:65%}
}