.wrap--play{max-width:1060px;min-height:100svh}.play-island{margin:18px 0 8px}.play{grid-template-columns:minmax(0,1fr);gap:18px;margin:18px 0 8px;display:grid}.play__main{min-width:0}.play__bar{grid-column:1/-1;justify-content:space-between;align-items:center;gap:12px;margin-bottom:-18px;display:flex}.play__bar[hidden]{display:none}.play__what{color:var(--ink-2);margin:0;font-size:16px}.play__what strong{color:var(--ink)}.play__new{gap:6px;min-height:44px;padding:0 16px;font-size:16px}.play__new:disabled{opacity:.4;cursor:default}.play__table{min-width:0}@media (width>=860px){.play{grid-template-columns:minmax(0,600px) minmax(280px,340px);align-items:start;column-gap:28px}.play__table{margin-top:62px}}.play__board{touch-action:none;max-width:600px;padding:62px 20px 46px 6px;position:relative}@media (width<=600px){.play__board{max-width:none;margin-inline:calc(-1 * var(--gutter));padding-left:2px;padding-right:15px}}@media (width>=860px) and (hover:none) and (pointer:coarse){.wrap--play{--bmax:clamp(600px, calc(100svh - 240px), 720px);max-width:calc(var(--bmax) + 410px)}.play{grid-template-columns:minmax(0, var(--bmax)) minmax(280px, 340px)}.play__board{max-width:var(--bmax)}}.play__sg.sg-wrap{border:2px solid var(--grid);box-shadow:var(--shadow-board);border-radius:2px}.play__sgbox{position:relative}.play__board:focus{outline:none}.play__board:focus-visible .play__sg.sg-wrap{outline:3px solid var(--focus);outline-offset:3px}.play__board:focus-visible .kbd-cursor{display:block}.play__overlay{z-index:20;background:var(--overlay-play);backdrop-filter:blur(2px);direction:rtl;border-radius:8px;justify-content:center;align-items:center;display:flex;position:absolute;inset:-56px -14px -40px 0;overflow-y:auto}.play__overlay[hidden]{display:none}.play__overlay .screen{text-align:center;width:100%;max-width:460px;padding:16px 18px}.play__overlay h2{margin:0 0 12px;font-size:clamp(24px,5vw,30px)}.play__overlay p{color:var(--ink-2);margin:0 0 12px;line-height:1.6}.setup-field{border:0;min-width:0;margin:0 0 12px;padding:0}.setup-field legend{color:var(--muted);margin:0 auto 6px;padding:0;font-size:15px;font-weight:700}.setup-field .choices{flex-wrap:wrap;justify-content:center;gap:6px;display:flex}.setup-field .choice{border:1.5px solid var(--rule);background:var(--washi);min-width:0;min-height:44px;color:var(--ink);font:700 16px/1.2 var(--f-body);cursor:pointer;border-radius:6px;flex-direction:column;flex:1 1 0;justify-content:center;align-items:center;padding:4px 8px;display:inline-flex}.setup-field .choice:hover{border-color:var(--ink)}.setup-field .choice[aria-pressed=true]{border-color:var(--seal);background:var(--seal);color:var(--on-seal)}.setup-field .choice .sub{opacity:.85;font-size:12px;font-weight:500}.setup-field.levels .choices{grid-template-columns:repeat(5,1fr);display:grid}.setup-field.clocks .choice{flex-basis:40%;font-size:14px}.play__overlay .level-hint{min-height:3.2em;margin-top:-2px;font-size:15px}.play__overlay .buttons{flex-direction:column;align-items:center;gap:4px;margin-top:6px;display:flex}.play .btn.big{min-width:220px;min-height:52px;font-size:19px}@media (width<=480px){.play__overlay{inset:-56px -14px -40px 0}.play__overlay .screen{padding:10px 8px}.setup-field{margin-bottom:8px}.setup-field .choice{min-height:40px;font-size:15px}.play__overlay .level-hint{font-size:14px;line-height:1.45}}.play .table-box{border:1.5px solid var(--ink);background:var(--washi);border-radius:6px;overflow:hidden}.play .ruser{align-items:center;gap:10px;min-height:60px;padding:10px 14px;display:flex}.play .ruser+.replay,.play .tools+.ruser{border-top:1px solid var(--rule)}.play .ruser .mark{font-size:22px;line-height:1}.play .ruser .who{flex-direction:column;flex:1;min-width:0;line-height:1.35;display:flex}.play .ruser .who strong{font-size:17px}.play .ruser .small{font-size:13px}.play .rclock{font:700 26px/1 var(--f-body);font-variant-numeric:tabular-nums;background:var(--washi-2);color:var(--ink-2);text-align:center;border-radius:4px;min-width:92px;padding:6px 10px}.play .ruser.running .rclock{background:var(--ink);color:var(--washi)}.play .ruser.running .rclock.byo{background:var(--seal);color:var(--on-seal)}.play .replay{border-bottom:1px solid var(--rule)}.play .moves-box{overscroll-behavior:contain;height:220px;overflow-y:auto}@media (width<=859.98px){.play .moves-box{height:140px}}.play .moves-box .empty{margin:0;padding:12px 14px}.play .moves{grid-template-columns:1fr 1fr;gap:2px;margin:0;padding:4px;list-style:none;display:grid}.play .moves .mv{width:100%;min-height:36px;color:var(--ink);font:600 16px var(--f-body);cursor:pointer;text-align:start;background:0 0;border:0;border-radius:4px;align-items:center;gap:6px;padding:0 8px;display:flex}.play .moves .mv:hover{background:var(--washi-2)}.play .moves .mv.active{background:var(--ink);color:var(--washi)}.play .moves .n{min-width:22px;color:var(--muted);font-variant-numeric:tabular-nums;font-size:12px}.play .moves .mv.active .n{color:inherit;opacity:.7}.play .moves .mark{font-size:14px}.play .replay-nav{border-top:1px solid var(--rule);display:flex}.play .replay-nav .nav{min-height:40px;color:var(--ink);cursor:pointer;background:0 0;border:0;flex:1;justify-content:center;align-items:center;display:inline-flex}.play .replay-nav .nav+.nav{border-inline-start:1px solid var(--rule)}.play .replay-nav .nav:hover:not(:disabled){background:var(--washi-2)}.play .replay-nav .nav:disabled{opacity:.3;cursor:default}.play .status-line{min-height:48px;font:700 16px var(--f-body);border-bottom:1px solid var(--rule);flex-wrap:wrap;align-items:center;gap:8px 12px;padding:8px 14px;display:flex}.play .status-line:empty{display:none}.play .status-line.thinking{color:var(--muted)}.play .status-line.thinking:before{content:"";background:var(--seal);border-radius:50%;width:10px;height:10px;animation:1s ease-in-out infinite think}@keyframes think{50%{opacity:.2}}@media (prefers-reduced-motion:reduce){.play .status-line.thinking:before{animation:none}}.play .status-line.error{color:var(--seal)}.play .status-line .btn{gap:6px;min-height:40px;padding:0 12px}.play .result{border-bottom:1px solid var(--rule);padding:14px}.play .result strong{font:800 24px/1.3 var(--f-display);display:block}.play .result p{margin:4px 0 10px;line-height:1.55}.play .result.won{background:var(--won-bg);color:var(--won-fg)}.play .result.lost{background:var(--lost-bg);color:var(--lost-fg)}.play .result.draw{background:var(--washi-2)}.play .result .buttons{flex-wrap:wrap;align-items:center;gap:8px 14px;display:flex}.play .result .btn{color:inherit;border-color:currentColor}.play .result .btn.primary{color:var(--on-seal);border-color:var(--seal)}.play .tools{display:flex}.play .tool{min-width:0;min-height:56px;color:var(--ink);font:600 12px/1.2 var(--f-body);cursor:pointer;background:0 0;border:0;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:2px;padding:4px 2px;display:inline-flex}.play .tool+.tool{border-inline-start:1px solid var(--rule)}.play .tool:hover:not(:disabled){background:var(--washi-2)}.play .tool:disabled{opacity:.35;cursor:default}.play .tool.danger{color:var(--seal)}.play .tools.confirm{align-items:stretch}.play .tools.confirm .q{align-items:center;padding:0 14px;font-weight:800;display:flex}.play .tools.confirm .tool{flex-direction:row;gap:6px;font-size:14px}.play .pieces-switch{justify-content:center;margin-top:12px;display:flex}@media (width<=859.98px){.play.setup-open .play__sg{display:none}.play.setup-open .play__board{margin-inline:0;padding:0}.play.setup-open .play__overlay{backdrop-filter:none;background:0 0;position:static}.play .table-box{flex-direction:column;display:flex}.play .table-box>.status-line,.play .table-box>.result{border-bottom:1px solid var(--rule);order:1}.play .table-box>.tools{border-bottom:1px solid var(--rule);order:2}.play .table-box>.ruser:first-child{order:3}.play .table-box>.replay{border-top:1px solid var(--rule);order:4}.play .table-box>.ruser:last-child{border-top:1px solid var(--rule);order:5}.play .tools+.ruser{border-top:0}}.clock-help{text-align:start;margin:-4px 0 12px;font-size:14.5px;line-height:1.6}.clock-help summary{cursor:pointer;text-align:center;color:var(--seal);text-underline-offset:3px;min-height:32px;font-weight:700;text-decoration:underline}.clock-help p{background:var(--washi-2);color:var(--ink);border-radius:6px;margin:6px 0;padding:10px 12px}.clock-help a{text-align:center;font-weight:600;display:block}.play .kif-export{border-top:1px solid #0000001f;flex-wrap:wrap;align-items:center;gap:4px 14px;margin-top:10px;padding-top:8px;display:flex}.play .kif-export .link{min-height:36px;color:inherit;font-size:14px}.play .kif-export a{color:inherit}.play .moves-head{border-bottom:1px solid var(--rule);justify-content:space-between;align-items:center;gap:8px;padding:4px 6px 4px 12px;display:flex}.play .moves-head strong{font-size:14px}.play .table-box:has(.kif-pop){overflow:visible}.kif-menu{position:relative}.kif-btn{border:1.5px solid var(--rule);background:var(--surface);min-height:44px;color:var(--ink);font:700 14px/1 var(--f-body);cursor:pointer;border-radius:22px;align-items:center;gap:6px;padding:0 12px;display:inline-flex}.kif-btn:hover:not(:disabled){border-color:var(--ink)}.kif-btn[aria-expanded=true]{background:var(--ink);border-color:var(--ink);color:var(--washi)}.kif-btn:disabled{opacity:.4;cursor:default}.kif-pop{top:calc(100% + 6px);z-index:30;text-align:start;background:var(--surface);border:1px solid var(--rule);border-radius:10px;flex-direction:column;gap:2px;width:260px;max-width:calc(100vw - 40px);padding:6px;display:flex;position:absolute;inset-inline-end:0;box-shadow:0 10px 28px #28190a38}.kif-pop p{margin:4px 8px}.kif-pop .kif-what{border-top:1px solid var(--rule);align-items:center;gap:4px;padding-top:6px;display:flex}.kif-item{min-height:44px;color:var(--ink);text-align:start;font:500 15px/1.2 var(--f-body);cursor:pointer;background:0 0;border:0;border-radius:6px;padding:0 12px}.kif-item:hover,.kif-item:focus-visible{background:var(--washi-2)}.mode-pick{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0 0 14px;display:grid}.mode-pick .mode{border:1.5px solid var(--rule);background:var(--washi);min-height:64px;color:var(--ink);font:700 16px/1.2 var(--f-body);cursor:pointer;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;gap:2px;display:flex}.mode-pick .mode[aria-pressed=true]{background:var(--seal);border-color:var(--seal);color:var(--on-seal)}.mode-pick .mode .sub{opacity:.85;font-size:12px;font-weight:500}.mode-pick .mode:disabled{opacity:.4;cursor:default}.local-how{text-align:start;border:1px solid var(--rule);background:var(--washi);border-radius:8px;align-items:center;gap:14px;margin:0 0 14px;padding:12px;display:flex}.play__overlay .local-how p{color:var(--ink);margin:0;font-size:14.5px}.mini-board{color:var(--muted);flex-direction:column;flex:none;align-items:center;gap:4px;font-size:12px;display:flex}.mini-board i{border:2px solid var(--grid);box-sizing:border-box;background-color:var(--kaya);background-image:linear-gradient(var(--grid) 1px, transparent 1px), linear-gradient(90deg, var(--grid) 1px, transparent 1px);background-position:-1px -1px;background-size:33.4% 33.4%;width:54px;height:54px;display:block}.play__seat[hidden]{display:none}.play__seat--top{margin-bottom:4px;transform:rotate(180deg)}.play__seat--bottom{margin-top:4px}.play .ruser.seat{border:1.5px solid var(--rule);background:var(--washi);border-radius:10px;gap:8px;min-height:56px;padding:6px 10px}.play .ruser.seat.turn{border-color:var(--seal);box-shadow:0 0 0 1px var(--seal)}.play .ruser.seat .who{min-width:0}.play .ruser.seat .who .hot{color:var(--seal);font-weight:600}.seat-actions{align-items:center;gap:6px;display:flex}.seat-actions .q{font-size:14px;font-weight:800}.seat-btn{border:1.5px solid var(--rule);background:var(--surface);min-height:44px;color:var(--ink);font:600 13px/1.1 var(--f-body);cursor:pointer;border-radius:6px;padding:0 10px}.seat-btn:hover:not(:disabled){border-color:var(--ink)}.seat-btn[aria-pressed=true]{background:var(--washi-2);border-color:var(--ink)}.seat-btn.primary{background:var(--seal);border-color:var(--seal);color:var(--on-seal)}.seat-btn.danger{border-color:var(--seal);color:var(--seal)}.seat-btn:disabled{opacity:.4;cursor:default}@media (width<=380px){.play .ruser.seat{gap:6px;padding:6px 8px}.seat-btn{padding:0 7px;font-size:12px}}