/* 黑白棋在线 · 绿呢棋盘风：经典绿呢 + 木纹边框 + 3D 翻转 */
.oth-wrap{
  --oth-felt:#1e7a4c; --oth-felt2:#16623d; --oth-wood:#8a5a2b; --oth-wood2:#6e451f;
  --oth-card:#f6f1e5; --oth-ink:#26221a; --oth-mute:#6b6250; --oth-gold:#c9a227;
  max-width:880px;margin:0 auto;padding:18px 14px 40px;
  font-size:15.5px;line-height:1.78;color:var(--oth-ink);
}
.oth-wrap h1,.oth-wrap h2{font-weight:800;}
.oth-hero{background:linear-gradient(135deg,var(--oth-wood),var(--oth-wood2));border-radius:14px;padding:22px 20px;color:#f7ecd9;box-shadow:inset 0 0 0 3px rgba(255,255,255,.12),6px 6px 0 rgba(0,0,0,.25);}
.oth-hero h1{font-size:clamp(23px,4.4vw,32px);margin:0 0 8px;}
.oth-hero h1 b{color:var(--oth-gold);}
.oth-setup{display:flex;gap:14px;flex-wrap:wrap;align-items:center;background:var(--oth-card);border:3px solid var(--oth-wood);border-radius:12px;margin-top:16px;padding:14px 16px;box-shadow:5px 5px 0 rgba(0,0,0,.15);}
.oth-opt{display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.oth-opt-l{font-weight:800;font-size:13.5px;color:var(--oth-mute);margin-right:2px;}
.oth-seg{border:2px solid var(--oth-wood);background:#fff;border-radius:999px;padding:6px 13px;font-size:13.5px;font-weight:700;color:var(--oth-ink);cursor:pointer;}
.oth-seg.on{background:var(--oth-wood);color:#fff;}
.oth-btn{border:2px solid var(--oth-ink);background:#fff;color:var(--oth-ink);font-size:14.5px;font-weight:800;padding:9px 18px;cursor:pointer;border-radius:8px;box-shadow:3px 3px 0 rgba(0,0,0,.2);}
.oth-btn:active{transform:translate(2px,2px);box-shadow:1px 1px 0 rgba(0,0,0,.2);}
.oth-btn.main{background:var(--oth-felt);border-color:var(--oth-felt2);color:#fff;}
.oth-btn.ghost{box-shadow:none;background:transparent;}
.oth-btn:disabled{opacity:.55;cursor:wait;}
.oth-main{display:grid;grid-template-columns:auto 1fr;gap:18px;margin-top:18px;align-items:start;}
.oth-board-zone{background:var(--oth-card);border:3px solid var(--oth-wood);border-radius:12px;padding:14px;box-shadow:5px 5px 0 rgba(0,0,0,.15);}
.oth-scorebar{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;gap:8px;flex-wrap:wrap;}
.oth-score{font-weight:900;font-size:17px;display:flex;align-items:center;gap:6px;}
.oth-score b{font-size:22px;}
.oth-turn{font-weight:800;color:var(--oth-felt2);font-size:14.5px;}
.oth-disc-mini{width:20px;height:20px;border-radius:50%;display:inline-block;border:2px solid rgba(0,0,0,.4);}
.oth-disc-mini.b{background:radial-gradient(circle at 35% 35%,#4a4a4a,#000);}
.oth-disc-mini.w{background:radial-gradient(circle at 35% 35%,#fff,#d9d4c5);}
.oth-board{display:grid;grid-template-columns:repeat(8,44px);grid-template-rows:repeat(8,44px);gap:3px;background:radial-gradient(ellipse at 30% 25%,var(--oth-felt),var(--oth-felt2));padding:12px;border:8px solid;border-image:linear-gradient(135deg,var(--oth-wood),var(--oth-wood2)) 1;border-radius:6px;box-shadow:inset 0 0 18px rgba(0,0,0,.45);width:max-content;max-width:100%;}
.oth-cell{position:relative;background:rgba(0,0,0,.12);border-radius:3px;cursor:pointer;perspective:300px;}
.oth-cell.legal::after{content:"";position:absolute;inset:12px;border-radius:50%;border:3px dashed rgba(255,255,255,.55);}
.oth-disc{position:absolute;inset:3px;border-radius:50%;transform-style:preserve-3d;transition:transform .45s cubic-bezier(.4,.1,.2,1.2);box-shadow:0 2px 3px rgba(0,0,0,.4);}
.oth-disc .face{position:absolute;inset:0;border-radius:50%;backface-visibility:hidden;}
.oth-disc .face.f-b{background:radial-gradient(circle at 35% 35%,#565656,#0b0b0b);transform:rotateY(0deg);}
.oth-disc .face.f-w{background:radial-gradient(circle at 35% 35%,#ffffff,#d6d1c2);transform:rotateY(180deg);}
.oth-disc.is-b{transform:rotateY(0deg);}
.oth-disc.is-w{transform:rotateY(180deg);}
.oth-disc.flip{animation:othFlip .45s;}
@keyframes othFlip{50%{transform:scale(1.18) rotateY(calc(90deg + var(--ry,0deg)));}}
.oth-ctrl{display:flex;align-items:center;gap:12px;margin-top:12px;flex-wrap:wrap;}
.oth-hint-toggle{display:flex;gap:6px;align-items:center;font-size:14px;font-weight:700;cursor:pointer;}
.oth-hint-toggle input{width:17px;height:17px;accent-color:var(--oth-felt);}
.oth-side{background:var(--oth-card);border:3px solid var(--oth-wood);border-radius:12px;padding:14px;box-shadow:5px 5px 0 rgba(0,0,0,.15);}
.oth-h2{font-size:15.5px;margin:0 0 8px;color:var(--oth-wood2);}
.oth-moves{margin:0 0 14px;padding-left:20px;font-size:13.5px;max-height:180px;overflow-y:auto;}
.oth-moves li{margin-bottom:2px;}
.oth-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:6px;font-size:13.5px;color:var(--oth-mute);}
.oth-stats b{color:var(--oth-ink);}
.oth-end{background:var(--oth-card);border:4px double var(--oth-wood);border-radius:14px;margin-top:18px;padding:20px;text-align:center;box-shadow:6px 6px 0 rgba(0,0,0,.15);}
.oth-end h2{margin:0 0 6px;font-size:22px;}
.oth-end p{margin:4px 0;}
.oth-end-tip{color:var(--oth-mute);font-size:14px;}
.oth-card{background:var(--oth-card);border:3px solid var(--oth-wood);border-radius:12px;margin-top:18px;padding:18px;box-shadow:5px 5px 0 rgba(0,0,0,.15);}
.oth-card h2{font-size:18px;margin:0 0 10px;}
.oth-rules{margin:0;padding-left:20px;}
.oth-rules li{margin-bottom:6px;}
.oth-faqs dt{font-weight:800;margin-top:12px;}
.oth-faqs dd{margin:4px 0 0;color:var(--oth-mute);}

html[data-theme="dark"] .oth-wrap{
  --oth-card:#242019; --oth-ink:#efe7d4; --oth-mute:#a99f8a;
}
html[data-theme="dark"] .oth-seg,
html[data-theme="dark"] .oth-btn{background:#2c2720;color:#efe7d4;}
html[data-theme="dark"] .oth-seg.on{background:var(--oth-felt);color:#fff;}
html[data-theme="dark"] .oth-btn.main{background:var(--oth-felt);color:#fff;}

@media (max-width:768px){
  .oth-main{grid-template-columns:1fr;}
  .oth-board{grid-template-columns:repeat(8,minmax(34px,1fr));grid-template-rows:repeat(8,minmax(34px,1fr));width:100%;}
  .oth-cell.legal::after{inset:9px;}
}

/* ===== v1.1 AI 意图 / 回放 / 残局挑战 ===== */
.oth-ai-intent{margin-top:10px;padding:9px 14px;border:2px dashed var(--oth-gold);border-radius:10px;background:rgba(201,162,39,.08);color:var(--oth-ink);font-size:14px;font-weight:600;}
.oth-cell.ai-flip{outline:3px solid var(--oth-gold);outline-offset:-3px;}
.oth-replay{display:flex;gap:10px;align-items:center;justify-content:center;flex-wrap:wrap;margin:12px 0;}
.oth-replay-label{font-weight:700;color:var(--oth-ink);font-size:14px;}
.oth-eg small{display:block;color:var(--oth-mute);font-size:13px;font-weight:400;margin-top:4px;}
.oth-eg-row{display:flex;gap:10px;flex-wrap:wrap;}
.oth-eg-status{margin-top:10px;padding:9px 14px;border:2px solid var(--oth-felt);border-radius:10px;background:rgba(30,122,76,.08);color:var(--oth-ink);font-size:14px;font-weight:600;}

html[data-theme="dark"] .oth-ai-intent{background:#2c2720;}
html[data-theme="dark"] .oth-eg-status{background:#2c2720;}