.volume,.play{background-color:transparent;border:none;cursor:pointer}.BestWithSound,.volume{position:absolute;top:.5rem;right:.5rem}.BestWithSound{display:flex;justify-items:baseline;font-weight:700}.App{text-align:center;font-size:2em}a,button.linkLike{font-size:1em;display:block;margin:1em auto;background:#ffffff4d;box-shadow:2px 2px 2px 2px #000;border:1px solid black;border-radius:.15em;padding:.25ch;text-decoration:none;color:#000;text-align:center}button.linkLike:disabled{background:#ffffffb3;color:#0006;box-shadow:none}a{width:18ch}a:visited{color:#000}a:hover,a:active{background:#fce07899;box-shadow:3px 3px 3px 3px #000}.board{position:relative;margin:.25rem;border:1px solid black;display:grid;grid-auto-flow:row;grid-template-columns:repeat(18,66px);width:fit-content;column-gap:0;row-gap:0;overflow:hidden}.board>div{width:64px;height:64px;border:1px solid black}.board>img,.board>figure{width:64px;height:64px;padding:0;margin:1px;border:none}.ship{transition:top .75s ease-in-out,left .75s ease-in-out}.ship>img{width:100%;height:100%;padding:0;margin:0;border:none}.ship.attacker{width:40px;height:40px}.ship.mirrored{transform:scaleX(-1)}.ship.defendant{width:40px;height:40px;margin-top:24px;margin-left:24px}.ship.inhibitTransition{transition:none!important}:root{--card-width: 120px;--card-height: calc(var(--card-width) * 1.8)}.card{border:2px solid black;border-radius:.5em;width:var(--card-width);height:var(--card-height);display:grid;grid-template-columns:1fr 2fr 1fr;grid-template-rows:1fr 5fr 1fr;align-items:center;justify-items:center;font-family:Protest Revolution,cursive;background-color:#f1d592;background-image:url(/image/compass.jpg);background-position:96% 14%;transition:transform 50ms ease-in-out;position:relative;-webkit-user-select:none;user-select:none}.card .pip:first-child{grid-row:1;grid-column:1}.card .pip:nth-child(3){grid-row:3;grid-column:3}.card .pip{font-size:3rem}.card .direction{grid-row:2;grid-column:2;font-size:6rem;position:relative;line-height:1}.card.dual .direction{font-size:2rem;line-height:1;width:min-content;transform:scale(1.5)}.card.dual .direction span{display:block;text-align:center}.card.wild img{width:100%;height:100%;transform:scale(1.4)}.card.wild .direction{width:100%;height:100%}@media (max-width: 475px){:root{--card-width: 100px}.card .direction{font-size:3em}.card.dual .direction{font-size:1.25em;transform:scale(175%)}.card.wild .direction{font-size:1.5em}.card.single .direction{transform:scale(1.5)}}.yourTurn{display:block;width:100%;text-align:center;font-size:1.3em;font-weight:700;margin-top:-1em}.cardSelect{margin:2em auto 0;width:fit-content}.cardSelect .dual button{font-size:1.75em}.treasureList{display:flex;justify-content:space-between}.treasureList p{margin-top:0}.treasure img{width:64px}.play{width:min-content;margin:0 auto;overflow-x:hidden;max-width:100vw}.play section{padding:0 1em}.play h2{font-size:1.75em}.play p{font-size:1.5em}.treasure{margin:0;width:20%;font-weight:700;font-size:1.2em;text-align:center}.treasure img{width:100%}.battleModal{position:absolute;top:40px;left:40px;right:40px;bottom:40px;border:2px solid black;background-image:url(/background.jpg);background-position:center center;background-size:cover;background-attachment:fixed;background-repeat:no-repeat;overflow:auto;-webkit-overflow-scrolling:touch;border-radius:10px;outline:none;padding:20px}.battleModal h2{margin-top:0}.battleModal .input{margin-top:2rem}.battleModal .input,.battleModal input,.battleModal button{font-size:1.1rem}.battleModal input{width:5ch}.prizeClaim{flex-wrap:wrap}h1{margin:0 auto;width:fit-content}.mapWrapper{display:grid;grid-template-columns:1fr 4fr 1fr;grid-auto-flow:row;gap:.5em}.log{display:flex;flex-direction:column-reverse;font-family:Eagle Lake;overflow-y:hidden;max-height:90vh;height:min-content}.message{margin-bottom:.2em}.message img{width:40px;display:inline;vertical-align:middle;position:relative;top:-5px}.wrapper{width:100%;display:flex;justify-content:center;gap:2em}.host{width:30ch}.host .title,.roomCodeLabel{font-size:1.5em}.roomCode{font-size:1.5em;margin-left:.5em;font-weight:700}.join label{display:block;margin:.5em 0}.join input{margin-right:1em}.error{width:max-content;background-color:red;color:#fff;padding:1em;font-weight:700;margin:1em auto;border-radius:.25em}.join label:has(:disabled){color:gray;text-decoration:line-through;text-decoration-thickness:2px}@font-face{font-family:Protest Revolution;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/protest-revolution-latin-400-normal-BdzMaXDN.woff2) format("woff2"),url(/assets/protest-revolution-latin-400-normal-DBB_G-tu.woff) format("woff");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Eagle Lake;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/eagle-lake-latin-400-normal-BnCxE_R4.woff2) format("woff2"),url(/assets/eagle-lake-latin-400-normal-CjHpqrCc.woff) format("woff");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-image:url(/background.jpg);background-position:center center;background-size:cover;background-attachment:fixed;background-repeat:no-repeat}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}fieldset{border:2px solid black;border-radius:.25em}select,input{background:transparent;border:2px solid black;border-radius:.25em}@media (min-width: 1500px){body{font-size:1.7em}}#app>fieldset{width:30ch;margin:0 auto}@font-face{font-family:blackletter;src:url(/BLKCHCRY.woff2) format("woff2");font-weight:400;font-style:normal}.script{font-family:Eagle Lake,cursive}label:has(:disabled){color:gray;text-decoration:line-through;text-decoration-thickness:2px}button{cursor:pointer}