@import"https://fonts.googleapis.com/css2?family=Black+Ops+One&display=swap";body{margin:0;min-width:320px;min-height:100vh;background-color:#aaa9a9;display:flex;flex-direction:column;align-items:center;justify-content:flex-start}html,body,#root{margin:0;padding:0;height:100%}.App{width:100%;max-width:1200px;padding:20px;box-sizing:border-box}.app-header{text-align:center;margin-bottom:-75px}h1{font-family:Black Ops One,cursive;font-size:5em;font-weight:900;color:#000;text-align:center;text-shadow:0 0 5px rgb(255,55,55),0 0 10px rgb(172,7,7),0 0 15px rgb(128,0,0);margin:0 0 -5px 5px;padding:0}.game-area{display:flex;align-items:flex-start;justify-content:center;gap:5px;margin-top:4%;width:100%}.game-board-container{display:flex;justify-content:center;align-items:center;width:600px}.tile.zone-red{background-color:red}.tile.zone-black{background-color:#000}.tile.zone-bridge-red{background-color:red}.tile.zone-bridge-black{background-color:#000}.turn-manager{margin-top:-25px}.turn-manager button{margin-top:0;padding:6px 15px;font-size:1.2em;font-weight:700;font-family:Black Ops One,cursive;color:#000;background-color:#e63946;border:none;border-radius:12px;cursor:pointer;text-shadow:0 0 3px rgb(255,255,255),0 0 6px rgb(255,55,55),0 0 8px rgb(172,7,7);box-shadow:0 0 10px #ff3737b3,0 0 20px #ac070799,0 0 30px #80000080;transition:transform .2s,box-shadow .3s}.turn-manager button:hover{transform:scale(1.05);box-shadow:0 0 15px #ff3737e6,0 0 25px #ac0707cc,0 0 35px #800000b3}.setup-menu{font-family:Black Ops One,cursive;padding:20px;max-width:400px;margin:auto;text-align:left;background:#111;border:1px solid #444;border-radius:12px;color:#fff}.setup-menu h2{margin-bottom:20px;font-size:1.5em;text-align:center}.setup-menu label{display:block;margin-bottom:10px}.setup-menu select{width:100%;padding:6px;margin-top:4px;margin-bottom:12px;background:#222;color:#fff;border:1px solid #555;border-radius:4px}.setup-menu button{padding:10px 20px;background:red;color:#fff;border:none;border-radius:6px;width:100%;cursor:pointer}.setup-menu button:hover{background:#960202}.card{width:64px;height:84px;background-color:#d3d3d3;border-radius:8px;border:2px solid #000;display:flex;align-items:center;justify-content:center;font-weight:700;text-transform:uppercase;cursor:pointer}.card.red{background-color:#4e0000;border-color:#dc143c}.card.black{background-color:#000;border-color:navy}.card.selected{border:2px solid green;box-shadow:0 0 10px green}.card.selected{border:3px solid limegreen;box-shadow:0 0 10px 2px #32cd32}.card.switchable{border:3px solid gold;box-shadow:0 0 10px 2px gold}.card-image{width:86%;height:auto;display:block;margin:0 auto}.tile{width:100px;height:100px;border:1px solid white;display:flex;align-items:center;justify-content:center;font-size:12px;position:relative;transition:background-color .2s;box-sizing:border-box;overflow:visible}.bridge-overlay{position:absolute;top:0;left:0;width:100%;height:98px;pointer-events:none;z-index:1}.checker-light{background-color:#8b8b8b}.checker-dark{background-color:#424242}.tile.highlight-move{background-color:#00ff00b3;animation:pulseGreen 1.5s infinite}.tile.highlight-attack{background-color:#ff0000b3;animation:pulseRed 1.5s infinite}.tile.highlight-reveal{background-color:#ffff00b3!important;animation:pulseYellow 1.5s infinite}.tile.highlight-switch{background-color:#0000ffb3;animation:pulseBlue 1.5s infinite}@keyframes pulseGreen{0%{background-color:#0f0}50%{background-color:#0f0c}to{background-color:#00ff004d}}@keyframes pulseRed{0%{background-color:red}50%{background-color:#f00c}to{background-color:#ff00004d}}@keyframes pulseYellow{0%{background-color:#ff0}50%{background-color:#ff0c}to{background-color:#ffff004d}}@keyframes pulseBlue{0%{background-color:#00f}50%{background-color:#00fc}to{background-color:#0000ff4d}}.highlight-revealable{box-shadow:inset 0 0 0 4px gold,inset 0 0 12px #ffd700b3}.bridge-img-wide{position:absolute;top:0;left:0;width:200px;height:98px;pointer-events:none;z-index:1}.tile#D1 .bridge-img-wide,.tile#D3 .bridge-img-wide{left:0}.tile#D1{border-right:none}.tile#D4{border-left:none}.tile#D2,.tile#D3{border-left:none;border-right:none}.tile>*:not(.bridge-img-wide){position:relative;z-index:2}.tile-id{position:absolute;top:4px;left:4px;font-size:.75rem;color:#fff;text-shadow:0 0 2px black;pointer-events:none}.manual-placement{display:flex;flex-direction:column;align-items:center}.board{display:grid;grid-template-columns:repeat(4,100px);grid-template-rows:repeat(7,100px);gap:0;margin-bottom:20px}.tray{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px}.tray.red{border-top:2px solid crimson}.tray.black{border-top:2px solid navy}.carousel{font-family:Black Ops One,cursive;background:#222;color:#fff;padding:20px;border-radius:12px;max-width:500px;height:320px;margin:0 auto;text-align:center;box-shadow:0 4px 20px #00000080;display:flex;flex-direction:column;justify-content:space-between;align-items:center}.carousel-content{flex-grow:1;display:flex;flex-direction:column;align-items:center;justify-content:center}.carousel h2{margin-top:-.2em;margin-bottom:6px}.carousel p{font-size:1.1em;margin-bottom:20px}.map-legend{font-family:monospace;white-space:pre;background:#1e1e1e;color:#fff;padding:10px;border-radius:6px;margin-bottom:1rem;text-align:left;display:inline-block}.buttons{display:flex;justify-content:space-between;gap:200px;width:100%}.buttons button{width:120px;height:44px;padding:10px 0;background:#444;color:#fff;border:none;border-radius:6px;cursor:pointer;text-align:center;display:flex;align-items:center;justify-content:center}.buttons button:hover{background:#666}.carousel ul,.rules-list{text-align:left;padding-left:1.2em;align-self:flex-start;margin:0 0 1rem}.carousel p{font-size:1.1em;margin-bottom:20px;text-align:left;align-self:flex-start}.fullscreen-toggle{position:absolute;top:12px;right:12px;font-size:1.5rem;background:transparent;border:none;cursor:pointer;z-index:1000;transition:transform .1s}.fullscreen-toggle:hover{transform:scale(1.2)}.action-menu{position:absolute;background-color:#333;border:2px solid #fff;padding:8px;border-radius:8px;display:flex;flex-direction:column;gap:8px;box-shadow:0 2px 10px #00000080}.action-menu-button{padding:8px 12px;font-size:1rem;font-weight:700;border:none;border-radius:4px;cursor:pointer;transition:background-color .2s ease}.action-menu-button.attack{background-color:#d32f2f;color:#fff}.action-menu-button.attack:hover{background-color:#b71c1c}.action-menu-button.reveal{background-color:#fbc02d;color:#000}.action-menu-button.reveal:hover{background-color:#f9a825}.action-menu-button.cancel{background-color:#757575;color:#fff}.action-menu-button.cancel:hover{background-color:#616161}.game-board{display:grid;justify-content:center;grid-template-columns:repeat(4,100px);grid-template-rows:repeat(7,100px);gap:0;margin:45px auto 25px;width:400px;border:10px solid rgb(255,255,255)}.end-turn-button{margin:20px auto;display:block;padding:10px 20px;font-size:18px;background-color:#444;color:#fff;border:none;border-radius:10px;cursor:pointer}.end-turn-button:hover{background-color:#666}.tile.highlight-reveal{background-color:#0000ff4d}.action-menu{position:absolute;width:200px;top:20px;right:20px;background-color:#222222b3;padding:15px;border-radius:10px;box-shadow:0 0 10px #00000038;text-align:center}.action-menu button{margin:5px;padding:8px 12px;font-size:16px;cursor:pointer}.game-board-container{display:flex;justify-content:center;align-items:center;margin-top:40px;transform:scale(1.25);transform-origin:top center}container{display:grid;grid-template-columns:repeat(4,100px);grid-template-rows:repeat(7,100px);gap:5px;justify-content:center;margin-top:20px}.winner-banner{position:absolute;top:450px;left:50%;transform:translate(-50%);z-index:1000;font-size:4rem;color:gold;text-shadow:2px 2px 4px #000}.game-board{position:relative}.ai-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#ffffffb3;display:flex;align-items:center;justify-content:center;z-index:10;font-size:1.5rem;font-weight:700}.discard-pile{font-family:Black Ops One,cursive;font-size:large;display:flex;flex-direction:column;align-items:center;margin:48px 48px 10px;border:2px solid #bf0000cd;background-color:#323232;padding:0 18px 18px;border-radius:8px;width:500px;height:400px;color:#a4a3a3}.discard-title{display:flex;align-items:center;justify-content:flex-start;gap:12px;margin-bottom:0}.tombstone-icon{margin:auto;width:64px;height:64px;color:#555}.discard-cards{display:grid;grid-template-columns:repeat(6,64px);gap:8px;margin-top:20px;justify-content:flex-start}.discard-card{width:64px;height:auto}.dynamic-rules{font-family:Black Ops One,cursive;background-color:#242424;width:505px;height:345px;margin-left:48px;border-radius:8px;margin-top:0;margin-bottom:0;border:2px,solid,rgb(34,34,34);color:#cacacaf4}li{padding-bottom:6px}.rules-panel-section{padding:0 16px 16px;border-radius:8px;color:#fff}.rules-panel-section.attack{background-color:#7b2117}.rules-panel-section.fortify{background-color:#2980b9}.rules-panel-section.reveal{background-color:#f1c40f;color:#222}.rules-panel-section h3{font-size:medium;font-weight:200;margin-bottom:8px}.rules-panel-section ul{margin-top:4px}.turn-manager-wrapper{width:100%;display:flex;justify-content:center;margin:10px auto 0}.turn-manager{width:480px;border:10px solid;margin-left:0;padding:20px;border-radius:12px;background:linear-gradient(45deg,#201f1fb3,#9e9999b3);text-align:center;box-shadow:0 0 12px;display:flex;flex-direction:column;align-items:center;gap:16px;margin-top:10px}.turn-manager.attack{border-color:#e63946}.turn-manager.fortify{border-color:#457b9d}.turn-manager.reveal{border-color:#f1c40f}.turn-manager h2,.turn-manager h3{font-family:Black Ops One;font-weight:700;letter-spacing:1px;margin:0}.turn-manager h2{margin-top:-10px;margin-bottom:-10px}.turn-manager.red h2,.turn-manager.red h3{color:#e63946}.turn-manager.black h2,.turn-manager.black h3{color:#1d1d1d}.turn-red{color:#6d0000}.turn-black{color:#000}.turn-manager.attack .turn-button{background-color:#e63946;color:rgb (50,50,50);border:2px solid #e63946}.turn-manager.fortify .turn-button{background-color:#457b9d;color:#323232;border:2px solid #457b9d}.turn-manager.reveal .turn-button{background-color:#f1c40f;color:#323232;border:2px solid #f1c40f}.turn-button{padding:8px 16px;border-radius:6px;cursor:pointer}