.schach-spiel{display:grid;grid-template-columns:minmax(0,1fr) 20rem;gap:20px;align-items:start;max-width:1000px;margin:0 auto}
.schach-spiel [hidden],.schach-schleier[hidden]{display:none!important}
.schach-brettbereich{min-width:0;display:flex;flex-direction:column;gap:5px}
.schach-brettspalte{display:flex;gap:10px;align-items:stretch}
.schach-geschlagen{min-height:30px;display:flex;align-items:center;gap:0;padding-left:24px;overflow:hidden}
.schach-geschlagen-figur{width:22px;min-width:14px;max-width:25px;height:28px;display:inline-flex;align-items:center;justify-content:center;flex:1 1 22px}
.schach-geschlagen-figur img{display:block;max-width:100%;max-height:100%;object-fit:contain;filter:drop-shadow(0 1px 1px rgba(28,16,8,.28))}
.schach-geschlagen-figur .schach-zeichen{font-size:1.35rem}
.schach-balken{position:relative;width:14px;border-radius:8px;background:#5d4326;overflow:hidden;flex:0 0 auto;box-shadow:inset 0 1px 3px rgba(0,0,0,.3)}
.schach-balken-weiss{position:absolute;left:0;right:0;bottom:0;height:50%;background:#f7f1e3;transition:height .35s ease}
.schach-brett{position:relative;flex:1 1 auto;display:grid;grid-template-columns:repeat(8,minmax(0,1fr));grid-template-rows:repeat(8,minmax(0,1fr));aspect-ratio:1;box-sizing:border-box;padding:4.2%;border:0;border-radius:16px;overflow:hidden;user-select:none;touch-action:manipulation;background:#4b2812 url('schachbrett-walnuss.webp') center/cover no-repeat;box-shadow:0 12px 28px rgba(35,22,12,.34),0 3px 7px rgba(35,22,12,.24)}
.schach-feld{position:relative;min-width:0;min-height:0;border:0;padding:0;margin:0;background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;font-family:inherit}
.schach-feld.schach-dunkel{background:transparent}
.schach-feld:focus-visible{outline:3px solid #2f6fed;outline-offset:-3px;z-index:3}
.schach-koordinate{position:absolute;font:600 .62rem/1 Arial,sans-serif;color:rgba(75,40,18,.6);pointer-events:none}
.schach-feld.schach-dunkel .schach-koordinate{color:rgba(247,241,227,.78)}
.schach-koordinate.schach-linie{right:3px;bottom:2px}
.schach-koordinate.schach-reihe{left:3px;top:2px}
.schach-feld.schach-letzter::after{content:"";position:absolute;inset:0;background:rgba(240,180,0,.42);pointer-events:none}
.schach-feld.schach-gewaehlt::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 5px #2f6fed;pointer-events:none}
.schach-feld.schach-tipp::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 5px rgba(44,173,96,.8);pointer-events:none}
.schach-feld.schach-ziel::before{content:"";position:absolute;width:30%;height:30%;border-radius:50%;background:rgba(44,110,60,.6);pointer-events:none}
.schach-feld.schach-ziel.schach-besetzt::before{width:86%;height:86%;background:none;border:5px solid rgba(217,74,74,.66);border-radius:50%}
.schach-feld.schach-imschach::after{content:"";position:absolute;inset:0;background:radial-gradient(circle,rgba(217,74,74,.85) 0,transparent 72%);pointer-events:none}
.schach-figur{position:relative;z-index:2;width:96%;height:96%;display:flex;align-items:center;justify-content:center;pointer-events:none}
.schach-figur img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 2px 1px rgba(28,16,8,.32))}
.schach-zeichen{font-size:min(9.5vw,3.2rem);line-height:1;text-shadow:0 1px 2px rgba(0,0,0,.3)}
.schach-zeichen.schach-weiss{color:#fffaf0}
.schach-zeichen.schach-schwarz{color:#22190f}
.schach-feld.schach-gesetzt .schach-figur{animation:schach-setzen .18s ease-out}
@keyframes schach-setzen{from{transform:scale(.82)}to{transform:scale(1)}}
.schach-seitenleiste{display:flex;flex-direction:column;gap:14px}
.schach-karte{background:#faf6ee;border:1px solid var(--line);border-radius:14px;padding:14px 16px}
.schach-einrichtung,.schach-ferninfo{grid-column:1/-1}
.schach-stand{margin:0 0 4px;font-size:1.05rem;font-weight:700}
.schach-stand-technik{margin:0;min-height:1.3em;font:13px/1.4 Arial,sans-serif;color:var(--muted)}
.schach-zugliste{max-height:17rem;overflow-y:auto}
.schach-zugliste table{width:100%;border-collapse:collapse}
.schach-zugliste td{padding:1px 2px}
.schach-zugliste td.schach-nummer{width:2.4rem;text-align:right;color:var(--muted);font:600 .82rem Arial,sans-serif}
.schach-zugliste button{width:100%;text-align:left;background:none;border:0;font:inherit;color:inherit;padding:2px 6px;border-radius:5px;cursor:pointer}
.schach-zugliste button:hover{background:#efe6d6}
.schach-zugliste button.schach-aktuell{background:#eadfce;box-shadow:inset 3px 0 0 var(--accent)}
.schach-leer{margin:0;color:var(--muted);font:14px/1.4 Arial,sans-serif}
.schach-einstellung{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.schach-einstellung label{font:700 .85rem Arial,sans-serif;color:var(--muted)}
.schach-auswahl{font:.9rem Arial,sans-serif;padding:.45rem .55rem;border:1px solid #a9afb5;border-radius:8px;background:#fff;color:inherit;min-height:38px}
.schach-bedienung{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.schach-taste{padding:.6rem .85rem;border:1px solid #202124;border-radius:10px;background:#f3f4f5;color:#202124;font:700 .85rem Arial,sans-serif;cursor:pointer;min-height:44px}
.schach-taste:not(:disabled):hover,.schach-taste:not(:disabled):focus-visible{background:#e2e5e8;outline:3px solid #f0b400;outline-offset:2px}
.schach-taste:disabled{opacity:.5;cursor:not-allowed}
.schach-primaer{background:#2f5f46;color:#fff;border-color:#234735}
.schach-primaer:not(:disabled):hover,.schach-primaer:not(:disabled):focus-visible{background:#234735;color:#fff}
.schach-hinweis{margin:12px 0 0;font:13px/1.45 Arial,sans-serif;color:var(--muted);overflow-wrap:anywhere}
.schach-schleier{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(44,37,29,.72)}
.schach-dialog{background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:20px 24px;max-width:24rem;text-align:center;box-shadow:var(--shadow)}
.schach-dialog h2{margin:0 0 6px;font-size:1.25rem}
.schach-dialog p{margin:0 0 14px;color:var(--muted);font:14px/1.45 Arial,sans-serif}
.schach-umwandlungswahl{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.schach-umwandlungswahl button{width:3.4rem;height:3.4rem;font-size:2rem;line-height:1;background:#efdfc0;border:1px solid #4b2812;border-radius:10px;cursor:pointer}
.schach-umwandlungswahl button img{width:2.6rem;height:2.6rem}
.schach-umwandlungswahl button:hover,.schach-umwandlungswahl button:focus-visible{outline:3px solid #f0b400;outline-offset:2px}
@media(max-width:860px){.schach-spiel{grid-template-columns:minmax(0,1fr)}.schach-zugliste{max-height:11rem}}
@media(prefers-reduced-motion:reduce){.schach-spiel *{animation:none!important;transition:none!important}}
.schach-einrichtung input.schach-auswahl{min-width:11rem}
.schach-einrichtung .schach-hinweis{margin-top:8px}
.schach-ferninfo p{margin:0 0 8px}
.schach-ferninfo p:last-child{margin-bottom:0}
.schach-fernzeile{font:15px/1.5 Arial,sans-serif;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.schach-code{font:700 1.1rem/1 "Courier New",monospace;letter-spacing:.12em;background:#efdfc0;border:1px solid #4b2812;border-radius:8px;padding:.35rem .6rem;user-select:all}
