.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000000b3;display:flex;justify-content:center;align-items:center;z-index:1000;opacity:0;visibility:hidden;transition:all .3s ease}.modal-overlay.active{opacity:1;visibility:visible}.pixel-modal{background-color:#f0f0d8;border:4px solid #3a3a3a;width:90%;max-width:500px;position:relative;box-shadow:8px 8px #3a3a3a,16px 16px #3a3a3a80;transform:scale(.8);transition:transform .3s ease;image-rendering:pixelated}.modal-overlay.active .pixel-modal{transform:scale(1)}.modal-header{background-color:#6b5b95;color:#f0f0d8;padding:12px 16px;border-bottom:4px solid #3a3a3a;display:flex;justify-content:space-between;align-items:center}.modal-title{font-size:20px;font-weight:700;text-shadow:2px 2px 0 #3a3a3a}.close-button{background-color:#e74c3c;color:#f0f0d8;border:none;width:24px;height:24px;cursor:pointer;position:relative;box-shadow:0 3px #c0392b,0 5px #a53125;transition:all .1s ease;font-weight:700;display:flex;justify-content:center;align-items:center}.close-button:hover{transform:translateY(2px);box-shadow:0 1px #c0392b,0 3px #a53125}.close-button:active{transform:translateY(4px);box-shadow:0 0 #c0392b,0 1px #a53125}.modal-content{padding:20px;color:#3a3a3a;line-height:1.5}.modal-content p{margin-bottom:1rem}.pixel-icon{image-rendering:pixelated;display:inline-block;margin-right:8px;vertical-align:middle}.modal-footer{padding:16px 20px;border-top:4px solid #3a3a3a;display:flex;justify-content:flex-end;gap:12px}.modal-button{padding:8px 16px;font-size:16px;font-weight:700;cursor:pointer;border:none;transition:all .1s ease;font-family:Courier New,monospace}.modal-button.confirm{background-color:#88c070;color:#2d2d2d;box-shadow:0 3px #6b9c5a,0 5px #4a6b3f}.modal-button.cancel{background-color:#95a5a6;color:#2d2d2d;box-shadow:0 3px #7f8c8d,0 5px #616a6b}.modal-button:hover{transform:translateY(2px)}.modal-button.confirm:hover{box-shadow:0 1px #6b9c5a,0 3px #4a6b3f}.modal-button.cancel:hover{box-shadow:0 1px #7f8c8d,0 3px #616a6b}.modal-button:active{transform:translateY(4px)}.modal-button.confirm:active{box-shadow:0 0 #6b9c5a,0 1px #4a6b3f}.modal-button.cancel:active{box-shadow:0 0 #7f8c8d,0 1px #616a6b}.message-box{position:absolute;right:0;bottom:0;background-color:#6b5b95;color:#f0f0d8;padding:2px 4px;border-bottom:4px solid #3a3a3a;display:flex;justify-content:space-between;align-items:center;z-index:100002;box-shadow:8px 8px #3a3a3a,16px 16px #3a3a3a80;image-rendering:pixelated;opacity:0;font-size:.5rem}