.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;background:#f1deb433;border:1px solid #f1deb4c2;border-radius:50%;place-items:center;width: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:clamp(6px,.7vw,9px);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-disc{z-index:3;aspect-ratio:1;width:78%;transform-style:preserve-3d;-webkit-user-select:none;user-select:none;border-radius:50%;animation:.22s cubic-bezier(.2,.8,.2,1) othello-place;position:absolute}.othello-disc:before{content:"";pointer-events:none;border-radius:50%;width:52%;height:34%;position:absolute;top:10%;left:15%;transform:rotate(-24deg)}.othello-disc.black{background:radial-gradient(circle at 34% 27%,#656963 0,#2b2e2b 25%,#101211 62%,#030403 100%);border:1px solid #000000eb;box-shadow:0 7px 11px #00000061,0 2px 1px #000000a6,inset -4px -6px 7px #00000080,inset 2px 2px 3px #ffffff21}.othello-disc.black:before{background:radial-gradient(#fff3,#0000 68%)}.othello-disc.white{background:radial-gradient(circle at 34% 27%,#fff 0,#f8f3e8 36%,#ded6c7 73%,#b9af9d 100%);border:1px solid #51473661;box-shadow:0 7px 11px #10271d52,0 2px 1px #433b2e57,inset -4px -6px 7px #74654e2b,inset 2px 2px 4px #ffffffeb}.othello-disc.white:before{background:radial-gradient(#fffffff2,#0000 68%)}.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}.othello-rank,.othello-file{z-index:5;color:#ecdab285;font-family:var(--font-app-mono), monospace;pointer-events:none;font-size:clamp(6px,.67vw,9px);font-weight:700;line-height:1;position:absolute}.othello-rank{top:6px;left:6px}.othello-file{bottom:6px;right:6px}@keyframes othello-place{0%{opacity:0;transform:translateY(-20%)scale(.76)}}@keyframes othello-flip{0%{transform:rotateY(88deg)scale(.92)}58%{transform:rotateY(-8deg)scale(1.03)}to{transform:rotateY(0)scale(1)}}.othello-scorebar{background:#ffffff73;border:1px solid #30322b1f;border-radius:9px;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;margin:0 0 12px;padding:8px 10px;display:grid}.othello-scorebar span{color:var(--ink-soft);align-items:center;gap:5px;font-size:9px;display:flex}.othello-scorebar span:last-child{justify-content:flex-end}.othello-scorebar .mini-stone{flex:0 0 16px;width:16px;height:16px}.othello-scorebar strong{color:var(--ink);font-family:var(--font-app-mono), monospace;font-size:14px}.othello-scorebar em{color:var(--red-dark);font-size:8px;font-style:normal;font-weight:650}.othello-search-readout p{line-height:1.45}@media (width>=851px),(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){.othello-board-frame{width:min(100%, var(--board-fit-height));margin-inline:auto}}