*{box-sizing:border-box}a{cursor:pointer;color:#04f;text-decoration:none}a:visited{color:#04f}html,body{display:grid;justify-content:center;align-content:center;text-align:center;margin:0;padding:0;min-height:100%;-webkit-user-select:none;user-select:none;color-scheme:dark;font-family:system-ui,sans-serif;font-variant-numeric:tabular-nums;font-size:12pt;line-height:1;color:#ccc;background-color:#000}h1,h2{font-size:120%;font-weight:400;color:#fff;margin:.5em}p{margin:.5em}button,input{-webkit-appearance:none;-moz-appearance:none;appearance:none;font-size:100%;background-color:transparent;color:#fff;border:1px solid #444;border-radius:.5em;padding:.5em 1em;margin:.5em}button:hover:enabled,input:hover:enabled{background-color:#444}button{height:3em;cursor:pointer}button.icon{width:3em}button:disabled{color:#444;border-color:#222;cursor:default}button.selected{background-color:#444;border-color:#fff}input{padding:.5em}select{font-size:100%;color:#fff;background-color:transparent;border:1px solid #444;border-radius:.5em;margin:1em;padding:1em;cursor:pointer}select:hover{background-color:#444}select option{color:#ccc;background-color:#000}.top{width:min(100vw,75vh);max-width:120mm}header{display:flex;flex-flow:row nowrap;align-items:center;background-color:#191919;height:14mm;border-radius:.5em .5em 0 0;padding:.5em}header h1{font-size:120%;margin:0;padding:0;flex-grow:1;text-transform:uppercase}header button{margin:0}header select{font-size:10pt;margin:0;padding:.5em}menu{background-color:#000;display:flex;flex-direction:column;align-items:stretch;list-style:none;margin:0;padding:.5em}menu li{display:flex;flex-direction:column}menu li.row{flex-direction:row;justify-content:center;gap:.5em}menu li.row button{flex:1}menu li button,menu li input{margin:.25em 0}.friends{background-color:#000;padding:.5em}.friends input{width:100%}.joinForm{display:flex;flex-direction:row;align-items:center;gap:.5em}.joinForm input{flex-grow:1;margin:0}.joinForm button{margin:0}.footerLinks{display:flex;flex-flow:row wrap;justify-content:center;gap:1em;padding:.5em;margin-top:.5em}.footerLinks a{display:flex;align-items:center;gap:.5em;color:#ccc;padding:.5em}.footerLinks a:hover{color:#fff}.titleBar{display:flex;flex-direction:row;align-items:baseline;background-color:#000;padding:.5em}.titleBar h1{text-align:left;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;margin:0}.titleBar .peers{flex:1;text-align:left;margin-left:.5em;font-size:90%}.titleBar .peers .peer:before{content:", "}.titleBar .peers .peer:first-child:before{content:""}.titleBar .peers .alone{color:red}.titleBar .voiceChat{display:flex;align-items:center;gap:.25em;margin-right:.5em}.titleBar .voiceChat button.icon{width:2.5em;height:2.5em;padding:0;margin:0;border-radius:50%}.titleBar .voiceChat button.icon.hangup{color:red;border-color:red}.titleBar .voiceChat button.icon.hangup:hover:enabled{background-color:maroon}.titleBar .voiceChat button.icon.muted{color:red;border-color:red}.titleBar .voiceChat .voiceStatus{font-size:80%;color:#ccc}.nicknamePrompt{display:flex;gap:.5em;padding:.5em}.nicknamePrompt input{flex:1;margin:0}.nicknamePrompt button{margin:0}.status{color:#444;margin:0}.status.playing{color:#fff}.status.win{color:red;font-weight:700}.game{width:100%}.game .labeledButtons{margin-top:.5em}.game .moveHistory{columns:4;column-fill:auto;list-style:none;margin:.5em 0;padding-inline-start:0;height:9em;overflow-x:auto;border:1px solid #444}.game .moveHistory::-webkit-scrollbar{height:.5em}.game .moveHistory::-webkit-scrollbar-track{background:#000}.game .moveHistory::-webkit-scrollbar-thumb{background:#444}.game .moveHistory li{cursor:pointer;text-align:left;color:#04f}.game .moveHistory li:nth-child(2n){color:red}.game .moveHistory li.selected{text-decoration:underline}.game .moveHistory li.forced{color:#fff;background:#04f}.game .moveHistory li.forced:nth-child(2n){background:#f00}.game .moveHistory li:hover{opacity:.7}.board.full{touch-action:none;width:min(100vw,75vh);max-width:120mm}.board.half{width:50%;max-width:60mm}.board line.bg{stroke-width:.03;stroke:#444;stroke-dasharray:.03}.board circle.bg{fill:#444}.board circle.bg.release.A{fill:#04f}.board circle.bg.release.B{fill:red}.board circle.last.A{fill:#0033bf}.board circle.last.B{fill:#bf0000}.board circle.selected{fill:#888}.board circle.target.A{fill:#002280}.board circle.target.B{fill:maroon}.board line.last{stroke-width:.05}.board line.last.A{stroke:#0033bf}.board line.last.B{stroke:#bf0000}.board .piece.A{fill:#04f}.board .piece.B{fill:red}.board .piece.dummy{pointer-events:none}.board line.arrow{stroke-width:.1;stroke-linecap:round}.board line.arrow.A{stroke:#002280}.board line.arrow.B{stroke:maroon}.board #arrowheadA{fill:#002280}.board #arrowheadB{fill:maroon}.board .analysisScore{font-size:.25px;font-weight:700;text-anchor:middle;dominant-baseline:central;pointer-events:none}.labeledButtons{display:flex;flex-flow:row wrap;justify-content:center;gap:.5em;padding:.5em}.labeledButtons button{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:.5em;flex:1;min-width:0;height:auto;padding:.75em 1em;margin:0;white-space:nowrap}.labeledButtons button.used{color:#fc0;border-color:#fc0}.labeledButtons button.used:hover:enabled{background-color:#ffcc0040}.labeledButtons button.used.selected{background-color:#ffcc0040;border-color:#fc0}.invisible{visibility:hidden}.botControls,.matchingOverlay{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.5em;margin-top:1em}.botControls select,.matchingOverlay select{height:3em;margin:0;padding:0 1em}.delayInput label{display:flex;align-items:center;gap:.5em;color:#ccc}.delayInput input[type=number]{width:5em;height:3em;text-align:right}.botGroup{display:flex;align-items:center;gap:.25em}.botGroup button,.botGroup select{margin:0}.botGroup.blue button,.botGroup.blue select{color:#04f;border-color:#04f}.botGroup.blue button:hover:enabled,.botGroup.blue button.selected,.botGroup.blue select:hover{background-color:#002280}.botGroup.red button,.botGroup.red select{color:red;border-color:red}.botGroup.red button:hover:enabled,.botGroup.red button.selected,.botGroup.red select:hover{background-color:maroon}.startChoice{display:flex;gap:.5em}.offlineNotice{color:#444;font-style:italic;padding:.5em}.dbProgress{flex-basis:100%}