/* TJK-Chess 14.6 — starting-position play modes */
.position-play-workspace{width:min(1480px,100%);margin:0 auto;padding:26px clamp(16px,4vw,56px) 54px}
.position-play-heading{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:18px}.position-play-heading h1{margin:5px 0 4px;font-size:clamp(1.9rem,3.5vw,3rem)}.position-play-heading p{max-width:780px;margin:0;color:#64748b;line-height:1.5}
.position-play-shell{display:grid;grid-template-columns:minmax(420px,680px) minmax(320px,1fr);gap:20px;align-items:start}.position-play-board-card,.position-play-options{border:1px solid var(--tjk-border,#dce4ef);border-radius:15px;background:#fff;box-shadow:0 9px 28px rgba(15,23,42,.07);overflow:hidden}
.position-play-board-wrap{position:relative;width:min(680px,100%);aspect-ratio:1;background:#789b59;container-type:inline-size;touch-action:none;user-select:none}.position-play-board{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));grid-template-rows:repeat(8,minmax(0,1fr));width:100%;height:100%}.position-play-square{position:relative;display:grid;place-items:center;min-width:0;min-height:0}.position-play-square.light{background:#eeeecf}.position-play-square.dark{background:#789b59}.position-play-square.is-selected{box-shadow:inset 0 0 0 5px #f2c21a}.position-play-square.is-last{box-shadow:inset 0 0 0 999px rgba(238,224,72,.31)}.position-play-square.is-legal:after{content:"";position:absolute;width:23%;aspect-ratio:1;border-radius:50%;background:rgba(23,45,26,.34);z-index:2}.position-play-square.is-capture:after{width:76%;border:5px solid rgba(23,45,26,.31);background:transparent}.position-play-piece{position:relative;z-index:3;display:grid;place-items:center;width:100%;height:100%;cursor:grab}.position-play-coordinate{position:absolute;z-index:4;font-size:clamp(8px,1.4cqw,12px);font-weight:850;color:rgba(24,50,24,.72)}.position-play-rank{top:3px;left:4px}.position-play-file{right:4px;bottom:2px}
.position-play-drag{position:fixed;z-index:15000;display:grid;place-items:center;pointer-events:none;transform:translate(-50%,-50%);filter:drop-shadow(0 7px 8px rgba(2,8,23,.25))}.position-play-drag .tjk-chess-piece{width:94%;height:94%}
.position-play-board-footer{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:11px 12px;border-top:1px solid #e0e7f0}.position-play-board-footer button{min-height:38px;padding:7px 12px;border:1px solid #cbd6e5;border-radius:8px;background:#fff;color:#172842;font-weight:750;cursor:pointer}.position-play-board-footer button:hover{background:#f3f7fd}.position-play-ply{margin-left:auto;color:#64748b;font-size:.82rem;font-weight:750}
.position-play-options{padding:20px}.position-play-options h2{margin:2px 0 6px}.position-play-options>p{margin:0 0 18px;color:#64748b;line-height:1.5}.position-play-mode-badge{display:inline-flex;margin-bottom:8px;padding:5px 9px;border-radius:999px;background:#eaf2ff;color:#0b5fe7;font-size:.72rem;font-weight:900;letter-spacing:.06em;text-transform:uppercase}.position-play-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}.position-play-field{display:grid;gap:6px;margin-bottom:13px;color:#263750;font-weight:780}.position-play-field select{min-height:43px;padding:8px 10px;border:1px solid #c8d3e1;border-radius:8px;background:#fff}.position-play-check{display:flex;align-items:center;gap:9px;margin:3px 0 14px;font-weight:750}.position-play-check input{width:18px;height:18px}.position-play-primary{width:100%;min-height:48px;border:1px solid #0b5fe7;border-radius:10px;background:#0b5fe7;color:#fff;font-weight:880;cursor:pointer}.position-play-primary:hover{background:#0748b5}.position-play-primary:disabled{opacity:.52;cursor:wait}.position-play-secondary{width:100%;min-height:42px;margin-top:9px;border:1px solid #cad5e3;border-radius:9px;background:#fff;color:#172842;font-weight:780;cursor:pointer}.position-play-message{margin-top:13px;padding:11px 12px;border:1px solid #d9e4f3;border-radius:9px;background:#f4f8fe;color:#36506f;line-height:1.45}.position-play-message.is-error{border-color:#efc1bc;background:#fff4f3;color:#9e2d24}.position-play-eval{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:center;margin:12px 0;padding:10px 12px;border:1px solid #dfe7f2;border-radius:9px;background:#f8fafc}.position-play-eval b{font-size:1.15rem;color:#173f9b}.position-play-moves{max-height:132px;overflow:auto;margin:12px 0;padding:10px;border:1px solid #e0e6ef;border-radius:9px;background:#fafbfd;color:#27364c;line-height:1.75}.position-play-empty-board{display:grid;place-items:center;min-height:420px;padding:30px;text-align:center;background:linear-gradient(145deg,#fff,#f0f5fc)}.position-play-empty-board span{font-size:4rem}.position-play-empty-board h3{margin:12px 0 6px}.position-play-empty-board p{max-width:480px;margin:0;color:#64748b}
@media(max-width:900px){.position-play-shell{grid-template-columns:1fr}.position-play-board-wrap{margin:auto}.position-play-grid{grid-template-columns:1fr}}

/* v14.7.1 opening-position analysis and navigation */
.position-play-annotations{position:absolute;inset:0;z-index:6;width:100%;height:100%;pointer-events:none}
.position-play-board-footer button:disabled{opacity:.42;cursor:not-allowed}
.position-play-moves{display:grid;gap:4px;max-height:154px}
.position-play-move-row{display:grid;grid-template-columns:32px minmax(0,1fr) minmax(0,1fr);gap:5px;align-items:center}
.position-play-move-row>b{color:#718096;font-size:.8rem;text-align:right}
.position-play-move-row button{min-height:30px;padding:4px 7px;border:1px solid transparent;border-radius:6px;background:transparent;color:#20324e;text-align:left;cursor:pointer;font-weight:720}
.position-play-move-row button:hover{border-color:#b9c8dd;background:#edf4ff}
.position-play-move-row button.is-active{border-color:#3159d9;background:#3159d9;color:#fff}
.position-play-engine{margin:12px 0;border:1px solid #d8e1ed;border-radius:10px;background:#f7f9fc;overflow:hidden}
.position-play-engine-title{display:flex;align-items:center;justify-content:space-between;padding:10px 11px 5px}
.position-play-engine-title label{display:flex;align-items:center;gap:6px;font-size:.8rem;font-weight:800}
.position-play-engine-controls{display:grid;grid-template-columns:minmax(110px,1.7fr) 82px 72px auto auto;gap:7px;align-items:end;padding:4px 10px 10px}
.position-play-engine-controls label{display:grid;gap:3px;color:#64748b;font-size:.67rem;font-weight:850;text-transform:uppercase}
.position-play-engine-controls select,.position-play-engine-controls button{min-height:38px;padding:6px 8px;border:1px solid #c5d0df;border-radius:8px;background:#fff;color:#1f3150;font-weight:750}
.position-play-engine-controls button{cursor:pointer}
.position-play-engine-controls button.is-active{border-color:#3159d9;background:#eaf0ff;color:#244fc5}
.position-play-engine-state{padding:0 11px 8px;color:#718096;font-size:.75rem}
.position-play-engine-lines{display:grid;gap:5px;padding:0 8px 9px}
.position-play-engine-line{display:grid;grid-template-columns:58px minmax(0,1fr) 38px;gap:7px;align-items:center;width:100%;min-height:36px;padding:6px 8px;border:0;border-radius:7px;background:#fff;color:#172842;text-align:left;cursor:pointer}
.position-play-engine-line:hover{background:#edf4ff}
.position-play-engine-line>b{color:#123f9e;font-size:.92rem}
.position-play-engine-line>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.8rem;font-weight:700}
.position-play-engine-line>small{color:#718096;text-align:right}
.position-play-engine-line.is-placeholder{cursor:default;opacity:.72}
@media(max-width:1120px){.position-play-engine-controls{grid-template-columns:1fr 78px 70px}.position-play-engine-controls>button{grid-column:auto}}
@media(max-width:560px){.position-play-engine-controls{grid-template-columns:1fr 1fr}.position-play-engine-controls label:first-child{grid-column:1/-1}.position-play-move-row{grid-template-columns:28px 1fr 1fr}}

/* v14.7.3: Analysis-board-style dragging in the opening position editor. */
.position-play-square.is-drag-source .position-play-piece{visibility:hidden}
.position-play-square.is-drop::before{content:"";position:absolute;inset:4%;box-sizing:border-box;border:5px solid #f2c21a;z-index:5;pointer-events:none}
.position-play-square.is-drop::after{display:none}

/* v15.1.77 — structure-select middlegame practice. */
.position-structure-field{margin-top:2px}.position-structure-note{margin:-7px 0 13px;padding:9px 11px;border:1px solid #d7e2ef;border-radius:9px;background:#f6f9fd;color:#5d6d82;font-size:.8rem;line-height:1.4}.position-structure-turn{display:grid;gap:3px;margin:3px 0 13px;padding:11px 12px;border:1px solid #c6d7ef;border-radius:10px;background:#eef5ff}.position-structure-turn strong{color:#174eaa}.position-structure-turn span{color:#5b6f8b;font-size:.82rem;line-height:1.4}
html[data-theme="dark"] .position-structure-note{background:#192432;border-color:#3a4b61;color:#b9c5d4}html[data-theme="dark"] .position-structure-turn{background:#17283b;border-color:#3d5877}html[data-theme="dark"] .position-structure-turn strong{color:#8db8ff}html[data-theme="dark"] .position-structure-turn span{color:#bdc9d8}
@media(max-width:620px){.position-play-workspace{padding-left:4px!important;padding-right:4px!important}.position-play-heading{padding-inline:5px}.position-play-board-card,.position-play-options{border-radius:9px}.position-play-options{padding:13px}}
