.othello-board-frame{background:linear-gradient(135deg,#ffffff21,#0000 23%),repeating-linear-gradient(9deg,#0000 0 24px,#ffffff05 25px 26px),linear-gradient(145deg,#49372b,#241d19 58%,#38291f);border:1px solid #231911cc;border-radius:16px;width:100%;max-width:920px;padding:clamp(10px,1.45vw,17px);position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #f1cd8929,inset 0 0 24px #00000052}.othello-board-frame:before{content:"";pointer-events:none;border:1px solid #d1ad685c;border-radius:11px;position:absolute;inset:5px;box-shadow:inset 0 0 0 1px #0000004d}.othello-board{z-index:1;aspect-ratio:1;perspective:900px;background:#126044;border:2px solid #092f25;border-radius:7px;grid-template-rows:repeat(8,1fr);grid-template-columns:repeat(8,1fr);width:100%;display:grid;position:relative;overflow:hidden;box-shadow:0 0 0 1px #e1bf785c,inset 0 0 35px #0000002b}.othello-square{cursor:default;background:radial-gradient(circle at 24% 18%,#ffffff0b,#0000 48%),linear-gradient(145deg,#ffffff06,#00000009),#17694c;border:1px solid #043123c7;border-top:0;border-left:0;place-items:center;min-width:0;min-height:0;padding:0;display:grid;position:relative;box-shadow:inset 1px 1px #ffffff09}.othello-square:nth-child(2n){background-color:#166548}.othello-square:nth-child(8n){border-right:0}.othello-square:nth-child(n+57){border-bottom:0}.othello-square.legal:not(:disabled){cursor:pointer}.othello-square.legal:not(:disabled):hover{background-color:#1d7957;box-shadow:inset 0 0 0 3px #f1d39033}.othello-legal-hint{z-index:2;aspect-ratio:1;will-change:var(--piece-layer,auto);background:#f1deb433;border:1px solid #f1deb4c2;border-radius:50%;place-items:center;width:max(22px,22%);transition:all .14s;display:grid;position:relative;box-shadow:0 0 0 4px #f1deb40e,0 2px 5px #00000029}.othello-legal-hint i{color:#fff5dcdb;font-family:var(--font-app-mono), monospace;font-size:13px;font-style:normal;font-weight:700;line-height:1}.othello-square.legal:not(:disabled):hover .othello-legal-hint{background:#f5d99157;border-color:#f5d991;transform:scale(1.32)}.othello-square{container-type:inline-size}.othello-disc{z-index:3;aspect-ratio:1;width:80%;transform-style:preserve-3d;-webkit-user-select:none;user-select:none;will-change:var(--piece-layer,auto);animation:.22s cubic-bezier(.2,.8,.2,1) othello-place;position:absolute}.othello-square.last-move .othello-disc:after{content:"";aspect-ratio:1;background:#d8a743;border-radius:50%;width:13%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 1px #fff8de8c,0 1px 3px #00000059}.othello-disc.recently-flipped{animation:.46s cubic-bezier(.22,.75,.26,1) othello-flip}@keyframes othello-place{0%{opacity:0;transform:translateY(-20%)scale(.76)}to{transform:translateY(-.017em)}}@keyframes othello-flip{0%{transform:translateY(-.017em)rotateY(88deg)scale(.92)}58%{transform:translateY(-.017em)rotateY(-8deg)scale(1.03)}to{transform:translateY(-.017em)rotateY(0)scale(1)}}.othello-search-readout p{line-height:1.45}@media (width>=851px) and (orientation:landscape),(width>=812px) and (height<=500px){.othello-board-frame{width:var(--fitted-board-size);margin-inline:auto}}@media (width<=600px){.othello-board-frame{border-radius:11px;padding:8px}}@media (width<=850px),(orientation:portrait){.othello-board-frame{width:min(100%, var(--board-fit-height));margin-inline:auto}}.game-control-panel.othello-control-panel.record-panel>.game-control-scroll{grid-template-rows:auto minmax(76px,1fr) auto auto}.othello-control-panel .bk-seat-who>.mini-stone,.othello-board-column .bk-seat-who>.mini-stone{flex:0 0 18px;width:18px;height:18px}.othello-seat-count{color:var(--ink);font-family:var(--font-app-mono), monospace;font-variant-numeric:tabular-nums;white-space:nowrap;font-size:14px;font-weight:700}.othello-board-column:has(>.othello-seat-line){row-gap:6px}html:lang(en) .othello-control-panel .bk-setup-label{width:44px}.othello-board[data-numbers] .othello-square.last-move .othello-disc:after{display:none}@media (width<=811px),(width<=850px) and (height>=501px),(orientation:portrait){.othello-board-column .othello-board-frame{max-width:none}}
