/*! HTML5 Boilerplate v8.0.0 | MIT License | https://html5boilerplate.com/ */html{color:#222;font-size:1em;line-height:1.4}::-moz-selection{background:#b3d4fc;text-shadow:none}::selection{background:#b3d4fc;text-shadow:none}audio,svg{vertical-align:middle}.hidden,[hidden]{display:none!important}.sr-only{border:0;clip:rect(0,0,0,0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.sr-only.focusable:active,.sr-only.focusable:focus{clip:auto;height:auto;margin:0;overflow:visible;position:static;white-space:inherit;width:auto}body,html{background:#4d4d4d;color:#eee;margin:0;min-height:90vh;padding:0}main{display:grid;min-height:90vh;place-items:center}aside{font-size:.7em}svg{height:calc(60vmax / 16 * 10);border:1px solid #ccc;width:60vmax;max-width:100%}@supports (aspect-ratio:16 / 10){svg{aspect-ratio:attr(width)/attr(height);height:auto;width:auto}}circle,polygon{fill:#eee}#host{fill:none;stroke:#eee;transition:points .2s ease-in}body,html{transition:background .2s ease-out,color .2s ease-out}section{max-width:60ch}a{color:#f49f0a}a[href^="#"],button[type=button],button[type=submit]{background-color:#f49f0a;border:none;color:#222;cursor:pointer;display:inline-block;margin-block:1em;padding:.5em 1em;text-align:center;text-decoration:none}label{display:block}.description{font-size:.8em}input[type=text],meter{display:block;min-width:100%}#match-form label{display:inline-block}#match-form .description,#match-form .matches,#match-form .matches .nothing{display:none}#match-form [value=new]:checked~#description-mode-new{display:block}#match-form [value=join]:checked~#description-mode-join,#match-form [value=join]:checked~#matches-mode-join,#match-form [value=join]:checked~#matches-mode-join ol:empty+.nothing{display:block}[data-view]{display:none}[data-role=HOST] [data-view=HOST]{display:initial}[data-role=OPPONENT] [data-view=OPPONENT]{display:initial}#scene-game{display:grid;grid-template-columns:1fr;max-width:100%}#users{display:flex;flex-direction:row;flex-wrap:wrap;grid-column:1/-1;align-items:end;justify-content:space-between}#users .tile{display:flex;flex-direction:column;justify-content:end;text-align:center}#users .tile::before{align-self:start;content:" ";display:inline-block;height:1em;margin:0 auto;width:1em;background-color:var(--user-color,transparent)}#users #opponent-list{display:flex;gap:1em}circle,polygon{transition:fill .2s ease-out}#host{transition:stroke .2s ease-out}#arrow-keys,#space-key{display:none}[data-role=HOST] #space-key{display:flex;flex-direction:column;font-family:monospace;justify-content:end}[data-role=HOST] #space-key button[type=submit]{display:block;margin-block:0;width:100%}[data-role=OPPONENT] #arrow-keys{display:grid;grid-template-areas:'.    TOP    .' 'LEFT BOTTOM RIGHT';align-items:end;column-gap:.5em;grid-template-rows:1fr auto;justify-content:center}#arrow-keys button[type=submit]{background:0 0;font-size:3rem;line-height:1;margin:0;max-height:3rem;padding:0}#arrow-keys form:nth-of-type(1){grid-area:TOP}#arrow-keys form:nth-of-type(2){grid-area:LEFT}#arrow-keys form:nth-of-type(3){grid-area:BOTTOM}#arrow-keys form:nth-of-type(4){grid-area:RIGHT}@media (orientation:landscape){#scene-game{grid-template-columns:3fr 1fr}}@media (prefers-color-scheme:light){body,html{background:#eee;color:#222}circle,polygon{fill:#222}#host{stroke:#222}}@media (prefers-color-scheme:dark){body,html{background:#222;color:#eee}circle,polygon{fill:#eee}#host{stroke:#eee}}