BenToT360/War-Card-Game

1body {2    margin: 0;3    min-height: 100vh;4    display: flex;5    align-items: center;6    justify-content: center;7    font-family: system-ui, sans-serif;8    background: #f4f4f5;9}10 11main {12    text-align: center;13    width: 360px;14}15 16h1 {17    margin-bottom: 0.25rem;18}19 20#status {21    min-height: 1.5rem;22    margin-bottom: 1rem;23    font-weight: 600;24}25 26.battle {27    display: flex;28    justify-content: center;29    align-items: center;30    gap: 1.5rem;31    margin-bottom: 1rem;32}33 34.hand {35    display: flex;36    flex-direction: column;37    align-items: center;38    gap: 0.5rem;39}40 41.hand h2 {42    margin: 0;43    font-size: 1rem;44}45 46.card {47    width: 100px;48    height: 130px;49    border: 1px solid #d4d4d8;50    border-radius: 10px;51    background: white;52    display: flex;53    align-items: center;54    justify-content: center;55    font-size: 1.1rem;56    font-weight: bold;57    padding: 0.5rem;58    text-align: center;59}60 61.card.red {62    color: #dc2626;63}64 65.card.black {66    color: #18181b;67}68 69.deck-count {70    font-size: 0.9rem;71    color: #52525b;72}73 74.vs {75    font-weight: 700;76    color: #a1a1aa;77}78 79#log {80    list-style: none;81    margin: 0 0 1rem;82    padding: 0.5rem;83    max-height: 160px;84    overflow-y: auto;85    background: white;86    border: 1px solid #e4e4e7;87    border-radius: 8px;88    text-align: left;89    font-size: 0.85rem;90}91 92#log li {93    padding: 0.15rem 0;94    border-bottom: 1px solid #f4f4f5;95}96 97#log li:last-child {98    border-bottom: none;99}100 101#log li.war {102    color: #c2410c;103    font-weight: 600;104}105 106.actions {107    display: flex;108    justify-content: center;109    gap: 0.75rem;110}111 112button {113    font-size: 1rem;114    padding: 0.5rem 1.25rem;115    border-radius: 8px;116    border: none;117    cursor: pointer;118    color: white;119}120 121button:disabled {122    opacity: 0.5;123    cursor: not-allowed;124}125 126#play-round {127    background: #ff7c00;128}129 130#play-round:not(:disabled):hover {131    background: #e56f00;132}133 134#new-game {135    background: #52525b;136}137 138#new-game:hover {139    background: #3f3f46;140}141