@import "https://fonts.googleapis.com/css2?family=Special+Elite&display=swap";.plane-container{text-align:center;flex-direction:column;align-items:center;width:100%;max-width:600px;padding:10px;display:flex}#room-status,#battle-status{color:#2c221e;z-index:20;background:0 0;min-height:1.2em;margin:10px auto;font-size:15px;font-weight:700;display:inline-block;position:sticky;top:0}#room-status:empty,#battle-status:empty{border:none;margin:0;padding:0;display:none}.boards-row{flex-wrap:wrap;justify-content:center;gap:40px;margin-top:15px;display:flex}.board-container{background:#faf4e6;border:2px solid #5c4a3d;padding:0;display:inline-block;position:relative;box-shadow:3px 3px #5c4a3d33}.board-col.hidden{display:none}.board-tabs{justify-content:center;gap:8px;margin:10px 0;display:none}.board-tab{color:#5c4a3d;cursor:pointer;background:#faf4e6;border:1px solid #b59b75;border-radius:4px;flex:1;max-width:160px;padding:8px 0;font-weight:700}.board-tab.active{color:#faf4e6;background:#5c4a3d;border-color:#5c4a3d}.board{touch-action:none;background:#d4c2a5;border:none;grid-template-rows:repeat(10,32px);grid-template-columns:repeat(10,32px);gap:1px;display:grid}.cell{box-sizing:border-box;cursor:pointer;background:#faf4e6;border:none;width:32px;height:32px;position:relative}.cell.enemy-plane{background:#c4d1bf!important}.cell.enemy-plane-head{background:#dfbe91!important}.cell.miss{background:#ede6d6}.cell.miss:after{content:"";background:0 0;border:2px solid #5c4a3d;border-radius:50%;width:10px;height:10px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.cell.hit{background:#e6dfd1}.cell.hit:after{content:"×";color:#3d312a;text-shadow:1px 1px #ffffff80,-1px -1px #0000001a;justify-content:center;align-items:center;width:100%;height:100%;font-size:24px;font-weight:700;display:flex;position:absolute;top:0;left:0;transform:rotate(6deg)scale(.95)}.cell.sunk{background:#ebd5d5}.cell.sunk:after{content:"×";color:#a63f3f;text-shadow:1.5px 1.5px #fff9,-1px -1px #50000033;justify-content:center;align-items:center;width:100%;height:100%;font-size:26px;font-weight:700;display:flex;position:absolute;top:0;left:0;transform:rotate(-8deg)scale(1.05)}#plane-layer{pointer-events:none;position:absolute;top:0;left:0}.plane-group{cursor:grab;pointer-events:auto;position:absolute;top:0;left:0}.plane-group.dragging{cursor:grabbing;opacity:.85;z-index:10}.plane-block{box-sizing:border-box;pointer-events:auto;position:absolute;box-shadow:inset 0 0 4px #2c221e26;background-color:#c4d1bf!important;background-image:repeating-linear-gradient(-45deg,#0000000a 0 1px,#0000 1px 5px)!important;border:none!important}.plane-block.plane-head{background-color:#dfbe91!important;background-image:repeating-linear-gradient(-45deg,#5028000d 0 1px,#0000 1px 5px)!important}.plane-block.attacked:after{content:"×";z-index:5;color:#3d312a;text-shadow:1px 1px #ffffff80,-1px -1px #0000001a;justify-content:center;align-items:center;width:100%;height:100%;font-size:24px;font-weight:700;display:flex;position:absolute;top:0;left:0;transform:rotate(6deg)scale(.95)}.plane-block.attacked.hit:after{text-shadow:1px 1px #0000004d;color:#fff!important}.plane-block.attacked.hit{box-shadow:none!important;background-color:#d98282!important;background-image:none!important}.plane-group.sunk .plane-block.attacked:after{content:"×";text-shadow:1.5px 1.5px #fff9,-1px -1px #50000033;font-size:26px;transform:rotate(-8deg)scale(1.05);color:#a63f3f!important}.plane-group.sunk .plane-block{box-shadow:none!important;background-color:#8c8c8c!important;background-image:none!important;border-color:#595959!important}.plane-group.invalid .plane-block{background:#d9828266!important;border-color:#d98282!important}.controls-panel{flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;margin:15px 0;display:flex}#plane-status{color:#5c4a3d;text-align:center;margin-top:12px;margin-bottom:0;font-size:14px;font-weight:700}button,input{border:1px solid #b59b75;border-radius:4px;outline:none;padding:8px 14px;font-family:Courier New,Courier,monospace;font-size:14px}button{color:#faf4e6;cursor:pointer;background:#5c4a3d;border:none;font-weight:700;transition:background .2s;box-shadow:2px 2px #0000001a}.rotate-icon{vertical-align:-1px;font-size:18px;line-height:1;display:inline-block}button:hover{background:#7a6855}button:disabled{cursor:not-allowed;box-shadow:none;background:#b5b5b5}input{color:#2c221e;background:#faf4e6}.game-started #btn-add,.game-started #btn-rotate{display:none!important}.legend-panel{color:#2c221e;z-index:15;background:0 0;justify-content:center;gap:20px;width:fit-content;margin:6px auto 12px;padding:6px 16px;font-size:14px;font-weight:700;display:flex;position:relative}.legend-item{align-items:center;gap:5px;display:flex}.legend-symbol{justify-content:center;align-items:center;width:18px;height:18px;font-family:Courier New,Courier,monospace,-apple-system,sans-serif;display:inline-flex}.legend-symbol.red-cross{color:#a63f3f;font-size:16px;transform:rotate(-8deg)}.legend-symbol.black-cross{color:#3d312a;font-size:15px;transform:rotate(6deg)}.legend-symbol.circle{color:#5c4a3d;font-size:18px;font-weight:700}.plane-container,.board-container,.plane-group{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}@media (width<=768px){.boards-row{flex-direction:column;align-items:center;gap:25px}body{padding:10px}body.show-board-tabs .board-tabs{display:flex}body.show-board-tabs .board-col{display:none}body.show-board-tabs .board-col.active{display:block}}@media (width>=769px){.board-tabs{display:none!important}.boards-row{flex-direction:row!important;justify-content:center!important;gap:40px!important;display:flex!important}.board-col{display:block!important}.plane-container{max-width:900px!important}}h1{letter-spacing:2px;border-bottom:2px dashed #3d312a;margin:5px 0;padding-bottom:5px;font-size:24px}h3{color:#5c4a3d;margin:8px 0;font-size:16px;font-weight:700}#menu-section{border-radius:4px;max-width:400px;margin:20px auto;padding:5px}body{color:#2c221e;background:#c8ad88 url(/paper-texture.webp);flex-direction:column;align-items:center;margin:0;padding:20px;font-family:Special Elite,monospace,sans-serif;display:flex}.btn{cursor:pointer;color:#1a1412;-webkit-appearance:none;background:0 0;border:2px solid #3d312a;border-radius:4px;margin:5px;padding:8px 16px;font-family:inherit;font-size:14px;font-weight:700;transition:all .1s;box-shadow:2px 2px #3d312a}.btn:active{transform:translate(2px,2px);box-shadow:0 0 #3d312a}input{color:#3d312a;background:0 0;border:2px solid #3d312a;border-radius:4px;outline:none;padding:7px;font-family:inherit;font-size:14px;box-shadow:inset 1px 1px 3px #0000001a}input::placeholder{color:#7a6655;opacity:1}input::placeholder{color:#7a6655;opacity:1}input::placeholder{color:#7a6655;opacity:1}