.practice-setup{max-width:1100px;margin:auto}.practice-pickers{display:grid;grid-template-columns:1fr 1fr;gap:28px}.practice-pickers section{min-width:0}.practice-pickers label{display:grid;gap:4px;margin:8px 0}.practice-pickers select{width:100%;min-width:0;padding:8px;background:#21343b;color:white;border:1px solid #526b72;border-radius:6px}.practice-preview{display:flex;align-items:center;gap:18px;margin:15px 0;min-height:160px}.practice-preview img{width:110px;border-radius:6px}.practice-preview p{font-size:13px}.p-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px;align-items:start}.p-mat{background:radial-gradient(ellipse at center,#234b4e,#15272d 80%);border:1px solid #3c6162;border-radius:14px;padding:12px}.p-side header{display:flex;align-items:center;gap:14px;font-size:12px;padding:5px;flex-wrap:wrap}.p-side header b{font-size:16px}.p-side header span:first-of-type{color:#a0eed8}.p-side header button{margin-left:auto}.p-hidden-hand{display:flex;justify-content:center;gap:4px;align-items:center;margin:8px}.p-hidden-hand span{width:28px;height:39px;display:grid;place-items:center;border:1px solid #678194;background:linear-gradient(25deg,#233c4e,#516d87);border-radius:3px;font-size:22px}.p-hidden-hand b{font-size:11px;margin-left:8px}.p-front{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;margin:10px 0}.p-zone{border:1px dashed #537279;border-radius:8px;padding:20px 8px 6px;position:relative;min-width:0}.p-zone-label{position:absolute;top:3px;left:9px;color:#a7c7c8;font-size:10px;text-transform:uppercase;letter-spacing:1.5px}.p-slots{display:flex;justify-content:center;gap:10px;align-items:start;flex-wrap:wrap}.p-back .p-slots{display:grid;grid-template-columns:repeat(5,minmax(0,1fr))}.p-member{max-width:114px;width:100%;position:relative;padding-top:0;text-align:center;min-width:0}.p-card{width:100%;padding:0;border-radius:6px;position:relative;display:block;min-width:0;background:#233d43;border:1px solid #52767b;cursor:grab}.p-card img{width:100%;aspect-ratio:5/7;object-fit:contain;display:block;border-radius:5px}.p-card.selected{outline:3px solid #eec66f}.p-member small{font-size:10px;display:block;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.p-resources{font-size:9px;color:#c2dbde;display:block}.p-hp{position:absolute;bottom:3px;right:3px;background:#15252de8;font-size:11px;padding:2px 4px;border-radius:3px;color:#b2f3da}.p-empty{width:100%;max-width:114px;aspect-ratio:5/7;display:grid;place-items:center;min-height:70px;color:#65868d;font-size:12px}.p-front .p-empty{width:114px}.p-support{display:flex;align-items:center;justify-content:center;gap:8px;flex-direction:column}.p-support>.p-card{width:76px}.p-support>span:last-child{font-size:10px}.p-attachments{display:flex;flex-wrap:wrap;gap:0;justify-content:center;max-height:40px;overflow:hidden}.p-attachments button{width:28px;height:20px;overflow:hidden;padding:0;border:1px solid #8da69c;border-radius:3px 3px 0 0;background:#15252d}.p-attachments img{width:28px;display:block}.p-member.rested>.p-card{transform:rotate(90deg) scale(.73)}.p-member.rested>.p-card.selected{outline:3px solid #eec66f}.p-divider{padding:12px 0;color:#afc9ce;display:flex;gap:15px;justify-content:center;font-size:10px;text-align:center;border-block:1px solid #45717b;margin:10px 0}.p-divider b{color:#a5ebda;font-size:18px}.p-hand{margin:10px 0;padding:8px;border:1px solid #4b7778;border-radius:8px;background:#142d34}.p-hand>b{font-size:12px}.p-hand>div{display:flex;overflow:auto;gap:8px;padding:8px 3px}.p-hand .p-card{width:122px;min-width:122px}.p-controls{position:sticky;top:8px;max-height:96vh;overflow:auto}.p-controls h2{font-size:20px;line-height:1.3}.p-controls p{font-size:12px;color:#bed0d5}.p-controls details{margin-top:15px;font-size:12px}.p-controls summary{cursor:pointer;color:#a3e2d3}#pChoices{display:grid;gap:5px;margin-top:10px;max-height:35vh;overflow:auto}#pChoices button{font-size:12px;text-align:left}.p-log{padding:0;list-style:none;max-height:230px;overflow:auto}.p-log li{padding:5px;border-bottom:1px solid #31484e;line-height:1.5}.p-log small{color:#80b8b8;display:block}.p-legal{outline:2px solid #84ebcb;background:#39766255}.p-result{color:#98f2c6!important}.p-hit{animation:pHit .8s ease-out}@keyframes pHit{0%{filter:brightness(1.25);transform:translateX(6px)}40%{transform:translateX(-6px)}100%{filter:none;transform:none}}
.p-pending{display:flex;gap:12px;align-items:center;margin-top:10px}.p-pending .p-card{width:80px}.p-pending small{font-size:12px;color:#a3e2d3}
@media(min-width:1500px){.p-layout{grid-template-columns:minmax(0,1fr) 340px}.p-member,.p-empty{max-width:135px}.p-front .p-empty{width:135px}}
@media(max-width:900px){.p-layout{grid-template-columns:1fr}.p-controls{position:static;max-height:none}.p-mat{padding:6px}.p-back .p-slots{gap:6px}.p-front{gap:6px}.p-member{max-width:105px}.p-hand .p-card{width:105px;min-width:105px}}
@media(max-width:550px){.practice-pickers{grid-template-columns:1fr}.p-zone{padding-inline:3px}.p-back .p-slots{gap:3px}.p-member small{font-size:8px}.p-resources{font-size:7px}.p-front .p-empty{width:75px}.p-hp{font-size:8px}.p-support>.p-card{width:55px}.p-divider{font-size:8px}.p-hand .p-card{width:95px;min-width:95px}}

/* Card choices, archives and live health share the replay viewer's visual language. */
.p-side{--team:var(--mint)}.bot-side{--team:var(--blue)}
.p-health{margin:3px 0 2px;line-height:1.4;gap:2px}.p-health strong{color:var(--ink);white-space:nowrap}
.p-health-meter{height:5px;overflow:hidden;margin-bottom:4px}.p-health-meter i{background:var(--team)}
.p-support .p-oshi{width:100%;max-width:114px}.p-inspect-oshi{cursor:zoom-in}.p-oshi-skills{font-size:11px;padding:4px 8px}
.p-pick-card{min-width:0;position:relative}.p-pick-card>strong,.p-pick-card>small{display:block;font-size:11px;line-height:1.35;overflow-wrap:anywhere;margin-top:3px}
.p-pick-card>small{color:var(--muted)}.p-inspect-choice{cursor:zoom-in;overflow:hidden}
.p-inspect-label{display:block;font-size:10px;color:var(--mint);padding:2px;background:#1c3037}
.p-copy-count{position:absolute;right:4px;top:3px;padding:1px 6px;background:#14242bec;border-radius:4px;font-size:18px}
#pChoices.p-visual-choices{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;max-height:54vh;padding:2px 5px 2px 2px;align-items:start}
#pChoices .p-expand-choices{grid-column:1/-1;text-align:center;color:var(--mint)}
.p-choice-tile{min-width:0;border:1px solid #465861;border-radius:8px;padding:5px;background:#23343e}
.p-choice-images{display:grid;grid-template-columns:repeat(auto-fit,minmax(80px,1fr));gap:5px}
.p-choose{width:100%;margin-top:6px;background:#284d48;color:#b4f6e3;font-weight:650}
.p-text-choice{grid-column:1/-1;padding:0;border:0}.p-text-choice .p-choose{margin:0}
#pCardBrowser{width:min(1100px,96vw);max-height:92vh}
#pBrowserTitle{font-size:18px}#pBrowserCards{padding:16px}
.p-choice-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(155px,1fr));gap:14px;align-items:start}
.p-choice-gallery .p-pick-card>strong{font-size:13px}.p-choice-gallery .p-pick-card>small{font-size:12px}
.p-gallery-help{grid-column:1/-1;font-size:13px;color:var(--muted)}
.p-archive-gallery>.p-pick-card{padding:6px;border:1px solid #465861;border-radius:8px;background:#23343e}
@media(min-width:1500px){.p-support .p-oshi{max-width:135px}}
@media(max-width:900px){.p-support .p-oshi{max-width:105px}.p-health{font-size:10px}}
@media(max-width:550px){.p-health{font-size:8px}.p-health-meter{height:4px}.p-support .p-oshi{max-width:105px}.p-oshi-skills{font-size:9px;padding:3px}.p-choice-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}#pBrowserCards{padding:10px}#pBrowserTitle{font-size:15px}}

.p-support>span:not(.p-zone-label){font-size:11px}.p-watch-replay{display:inline-block;margin:8px 0;font-weight:650}

/* Compact physical playmat: hand / back / front, mirrored for the opponent. */
.fit-table .p-mat{padding:4px 8px}.fit-table .p-side header{padding:2px;font-size:10px;gap:8px;line-height:18px}
.fit-table .p-side header b{font-size:12px}.fit-table .p-side header button{font-size:10px;padding:2px 5px}
.fit-table .p-front{margin:3px 0;gap:8px}.fit-table .p-zone{padding:14px 4px 3px;border-radius:5px}
.fit-table .p-zone-label{font-size:9px;line-height:10px;letter-spacing:.7px;top:2px}
.fit-table .p-member{max-width:calc(var(--fit-unit) + 28px)}
.fit-table .p-member>.p-card{width:var(--fit-unit);margin:auto}
.fit-table .p-member small{font-size:9px;line-height:11px}.fit-table .p-resources{font-size:9px;line-height:11px}
.fit-table .p-health{font-size:9px;line-height:12px;margin:1px 0;flex-wrap:nowrap;gap:4px}.fit-table .p-health-meter{height:3px;margin-bottom:1px}
.fit-table .p-empty,.fit-table .p-front .p-empty{width:var(--fit-unit);max-width:var(--fit-unit);min-height:0;font-size:10px}
.fit-table .p-slots{gap:4px}.fit-table .p-back .p-slots{justify-items:center;min-height:calc(var(--fit-unit) * 1.4 + 51px)}
.fit-table .p-attachments{height:14px;min-height:14px;max-height:14px;flex-wrap:nowrap;overflow:hidden;width:var(--fit-unit);margin:auto}
.fit-table .p-attachments button{min-width:0;flex-shrink:1;height:14px}.fit-table .p-attachments img{width:100%}
.fit-table .p-support{gap:3px}.fit-table .p-support .p-oshi{max-width:var(--fit-unit);width:var(--fit-unit)}
.fit-table .p-support>span:not(.p-zone-label){font-size:10px;line-height:12px}.fit-table .p-oshi-skills{padding:1px 5px;font-size:10px}
.fit-table .p-divider{margin:3px 0;padding:2px 0;font-size:9px;line-height:13px;gap:8px}.fit-table .p-divider b{font-size:12px;line-height:13px}
.fit-table .p-hand{padding:2px 5px;margin:3px 0 0}.fit-table .p-hand>b{font-size:10px;line-height:12px;display:block}
.fit-table .p-hand>div{padding:2px 0;gap:5px;scrollbar-width:thin}
.fit-table .p-hand .p-card{width:calc(var(--fit-unit) * .8);min-width:calc(var(--fit-unit) * .8)}
.fit-table .p-hidden-hand{margin:2px;gap:3px}.fit-table .p-hidden-hand span{width:14px;height:19px;font-size:12px}
@media(max-width:900px){.fit-table .p-controls{position:static;max-height:none}}
@media(max-width:550px){
 .p-view-actions{gap:8px}.p-view-actions button{font-size:11px;padding:5px}.board-fit-control{font-size:11px}
 .fit-table .p-mat{padding:3px}.fit-table .p-side header{gap:4px;font-size:9px}.fit-table .p-front{gap:4px}
}

@media(min-width:901px){
 .fit-table .p-member{max-width:calc(var(--fit-unit) + 86px);display:grid;grid-template-columns:var(--fit-unit) minmax(0,1fr);grid-template-rows:14px auto auto 3px auto;column-gap:5px;text-align:left}
 .fit-table .p-member>.p-attachments{grid-column:1;grid-row:1}
 .fit-table .p-member>.p-card{grid-column:1;grid-row:2/6;align-self:start}
 .fit-table .p-member small{grid-column:2;grid-row:2;align-self:end;font-size:10px;line-height:12px}
 .fit-table .p-health{grid-column:2;grid-row:3;flex-wrap:wrap;justify-content:start;line-height:12px;font-size:10px}
 .fit-table .p-health-meter{grid-column:2;grid-row:4;margin:0}
 .fit-table .p-resources{grid-column:2;grid-row:5;align-self:start;line-height:12px;font-size:9px}
 .fit-table .p-back .p-slots{min-height:calc(var(--fit-unit) * 1.4 + 16px)}
 .fit-table .p-support{display:grid;grid-template-columns:var(--fit-unit) auto;grid-template-rows:1fr 1fr;justify-content:center;column-gap:8px}
 .fit-table .p-support .p-oshi{grid-column:1;grid-row:1/3}
 .fit-table .p-support>span:not(.p-zone-label){grid-column:2;grid-row:1;align-self:end}
 .fit-table .p-oshi-skills{grid-column:2;grid-row:2;align-self:start}
}

/* Public resource counts and face-down piles; one back for each remaining card. */
.p-supply-counts{display:flex;align-items:center;gap:18px;min-width:0}
.p-counter{display:flex;align-items:center;gap:9px;min-width:0;font-variant-numeric:tabular-nums}
.p-counter-text{display:flex;flex-direction:column;gap:2px;align-items:flex-start}
.p-counter .p-counter-value{font-size:30px;font-weight:800;line-height:1;letter-spacing:-.7px;color:#f3f8fc}
.p-counter .p-counter-label{font-size:11px;line-height:14px;font-weight:650;color:#b8d1d6;white-space:nowrap}
.p-counter-life .p-counter-value{color:#a5f0d5}.p-counter-power .p-counter-value{color:#cfbeff}
.p-resource-stack{--back-width:29px;--back-height:40px;--pile-density:1;position:relative;display:block;flex:none;width:var(--back-width);height:calc(var(--back-height) + 16px * var(--pile-density));isolation:isolate}
.p-resource-back,.p-resource-empty{position:absolute;left:0;bottom:calc(var(--card-offset,0px) * var(--pile-density));display:grid;place-items:center;width:var(--back-width);height:var(--back-height);border:1px solid #a5c6c7;border-radius:3px;box-shadow:0 1px 3px #07141bc9;background:repeating-linear-gradient(135deg,#2e6263 0 5px,#28575d 5px 10px);font-style:normal}
.p-resource-back::before{content:"";position:absolute;inset:3px;border:1px solid #b7e2d566;border-radius:2px}
.p-resource-back>span{font-size:22px;line-height:1;color:#dbf9ed;text-shadow:0 1px 3px #122d40}
.p-counter-power .p-resource-back{border-color:#b3b7e3;background:repeating-linear-gradient(135deg,#515077 0 5px,#393e65 5px 10px)}
.p-counter-power .p-resource-back::before{border-color:#e0d1fa88}.p-counter-power .p-resource-back>span{color:#eee6ff}
.p-resource-empty{border:1px dashed #6f8a95;box-shadow:none;background:#12252b55}
.p-resource-empty::after{content:"—";font-size:16px;color:#8aa1ae}
.p-oshi-info{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:5px;min-width:0}
.p-sp-used{font-size:11px;color:#b7c7cf}.p-oshi-info .p-oshi-skills{margin:0}
.p-side header{column-gap:16px;padding:5px 3px}.p-side header>b{font-size:16px}
.p-support{display:grid;grid-template-columns:minmax(0,114px) auto;grid-template-rows:1fr;justify-content:center;gap:12px}
.p-support .p-oshi{grid-column:1;grid-row:1}.p-support .p-oshi-info{grid-column:2;grid-row:1}
.fit-table .p-side header{padding:3px 2px;column-gap:14px}
.fit-table .p-side header>b{font-size:14px}.fit-table .p-side header button{font-size:11px}
.fit-table .p-counter .p-counter-value{font-size:26px}.fit-table .p-counter .p-counter-label{font-size:10px;line-height:12px}
.fit-table .p-support{grid-template-columns:var(--fit-unit) auto;grid-template-rows:1fr;gap:8px}
.fit-table .p-support .p-oshi{grid-column:1;grid-row:1}.fit-table .p-support .p-oshi-info{grid-column:2;grid-row:1}
@media(min-width:1500px){.p-support{grid-template-columns:minmax(0,135px) auto}}
@media(max-width:900px){
 .p-support,.fit-table .p-support{display:flex;flex-direction:column;gap:5px}
 .p-oshi-info{align-items:center;gap:3px}.p-counter-power{gap:5px}
 .p-counter-power .p-resource-stack{--back-width:21px;--back-height:29px;--pile-density:.65}
 .p-counter-power .p-resource-back>span{font-size:17px}
}
@media(max-width:550px){
 .p-side header,.fit-table .p-side header{column-gap:7px;row-gap:3px}
 .p-side header>b,.fit-table .p-side header>b{font-size:12px}
 .p-supply-counts{gap:10px}.p-counter{gap:5px}
 .p-counter .p-counter-value,.fit-table .p-counter .p-counter-value{font-size:22px}
 .p-counter .p-counter-label,.fit-table .p-counter .p-counter-label{font-size:9px;line-height:11px}
 .p-resource-stack{--back-width:22px;--back-height:31px;--pile-density:.7}
 .p-resource-back>span{font-size:18px}
 .p-side header button,.fit-table .p-side header button{font-size:10px;padding:3px 5px}
 .p-sp-used{font-size:9px}
}

@media(max-width:900px){
 .fit-table .p-front{grid-template-columns:repeat(3,minmax(0,1fr))}
 .fit-table .p-member>.p-card,.fit-table .p-attachments,.fit-table .p-support .p-oshi{width:min(100%,var(--fit-unit))}
 .fit-table .p-empty,.fit-table .p-front .p-empty{width:min(100%,var(--fit-unit));max-width:100%}
}

/* Setup: same deck view as Verse (Oshi spotlight + full list) */
.practice-versus{margin:14px 0}
.practice-versus .practice-preview{display:block;min-height:0;margin:8px 0 0}
.practice-versus .practice-preview .ws-zone>.ws-grid{max-height:clamp(220px,34vh,420px);overflow-y:auto;align-content:start;scrollbar-width:thin}
.practice-versus .practice-preview img{width:100%}
.practice-versus .practice-preview .oshi-hero-card{width:clamp(96px,9vw,138px)}
#pAgentNote{margin:2px 0 0;font-weight:400;font-size:11px}
/* Selected-card details in the side panel */
.p-card-detail{margin:10px 0;border:1px solid #465861;border-radius:10px;background:#1d2c35;padding:10px;scroll-margin:12px}
.p-card-detail:has(.p-detail-hint){padding:8px 10px;border-style:dashed;background:transparent}
.p-detail-hint{margin:0;color:var(--muted);font-size:13px}
.p-detail-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.p-detail-close{min-height:0;padding:0 8px;font-size:18px;line-height:24px;border-radius:6px}
.p-detail-body{display:grid;grid-template-columns:minmax(96px,42%) 1fr;gap:10px;align-items:start}
.p-detail-art{padding:0;border:0;background:none;cursor:zoom-in;border-radius:8px;overflow:hidden;line-height:0}
.p-detail-art img{width:100%;height:auto;display:block;border-radius:8px}
.p-detail-text h3{margin:0;font-size:17px;line-height:1.2}
.p-detail-num{color:var(--muted);font-size:12px}
.p-detail-facts,.p-detail-live,.p-detail-tags,.p-detail-baton{margin:6px 0 0;font-size:13px;line-height:1.4}
.p-detail-live{color:#9fe3c8}.p-detail-tags{color:var(--muted)}
.p-detail-effect{margin:10px 0 0;font-size:13px;line-height:1.5}
.p-detail-skill{margin-top:10px;padding-top:8px;border-top:1px solid #34464f}
.p-detail-skill>div{display:flex;align-items:center;justify-content:space-between;gap:6px}
.p-detail-skill small{color:var(--muted);font-size:11px}
.p-detail-skill b{display:block;font-size:14px;margin-top:2px}
.p-detail-skill p{margin:4px 0 0;font-size:13px;line-height:1.5}
.p-cost{display:inline-grid;place-items:center;width:18px;height:18px;margin-left:2px;border-radius:50%;font-size:10px;font-weight:700;color:#10181d;background:#cfd8dc;vertical-align:middle}
.p-cost-white{background:#f2f4f5}.p-cost-green{background:#5fcf87}.p-cost-red{background:#ef6b6b}.p-cost-blue{background:#5aa9f0}
.p-cost-purple{background:#b58cf0}.p-cost-yellow{background:#f3d35b}.p-cost-colorless{background:#9aa6ad}
/* Bottom-of-deck ordering */
.p-order-help{margin:0 0 8px;font-size:13px;line-height:1.45}
#pChoices.p-order-choices{display:block;max-height:none}
.p-order-row{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(var(--n,3),minmax(0,1fr));gap:6px}
.p-order-item{min-width:0;border:1px solid #465861;border-radius:8px;padding:5px;background:#23343e;cursor:grab;text-align:center}
.p-order-item.p-order-dragging{opacity:.45}
.p-order-item:active{cursor:grabbing}
.p-order-pos{display:block;font-size:11px;color:#9fe3c8;margin-bottom:3px}
.p-order-item .p-card{width:100%;padding:0}
.p-order-item strong{display:block;font-size:11px;line-height:1.3;margin-top:3px;overflow-wrap:anywhere}
.p-order-moves{display:flex;gap:4px;margin-top:4px}
.p-order-moves button{flex:1;min-height:28px;padding:0}
.p-order-arrow{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);margin:6px 2px}
.p-order-confirm{width:100%;margin-top:4px}

/* Touch drag (phones and tablets) */
#playPage [data-source]{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
#playPage .p-hand [data-source]{touch-action:pan-x}
#playPage .p-order-item{touch-action:none;-webkit-touch-callout:none}
#playPage img{-webkit-user-drag:none}
.p-touch-ghost{position:fixed;left:0;top:0;z-index:100;pointer-events:none;border-radius:6px;box-shadow:0 10px 24px #000c,0 0 0 2px #9fe3c8;opacity:.95;will-change:transform}
.p-touch-source{opacity:.35}
body.p-touch-dragging{overscroll-behavior:none}
#playPage .p-drop-hover{outline:3px solid #9fe3c8;outline-offset:2px;background-color:#9fe3c822}
#playPage .p-order-item.p-drop-hover{outline:2px dashed #9fe3c8}