html{background-color:#242424}#menu{background:#1a1a1a;border:4px double #d4af37;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;gap:1.5rem;max-width:300px;margin:100px auto;padding:2rem;display:flex;box-shadow:0 0 20px #00000080}.menu-button{text-transform:uppercase;letter-spacing:1px;cursor:pointer;color:#d4af37;background:#2c2c2c;border:2px solid #d4af37;width:100%;padding:12px 24px;font-family:Georgia,serif;font-size:1.2rem;font-weight:700;transition:all .2s ease-in-out}.menu-button:not(:disabled):hover{color:#1a1a1a;background:#d4af37;transform:translateY(-2px);box-shadow:0 0 15px #d4af37}.menu-button:not(:disabled):active{transform:translateY(1px)}.menu-button:disabled{color:#444;cursor:not-allowed;opacity:.6;background:#121212;border-color:#444}@media (width<=600px){section.main-menu{max-width:90%;margin:50px auto;padding:1.5rem}button{padding:16px 20px;font-size:1.1rem}}#class-and-stats{background:#1e1e1e;border:1px solid #444;border-radius:8px;gap:2rem;margin:1.5rem 0;padding:1.5rem;display:flex}#stat-block{background:#121212;border-left:3px solid #4a6741;border-radius:6px;flex:1;padding:1rem}#stat-block h3{color:#888;text-transform:uppercase;letter-spacing:1px;margin-top:0;font-size:.9rem}#stat-block p{color:#ddd;margin:8px 0;font-family:Courier New,Courier,monospace;font-size:1.1rem}#class-selection-menu{flex-direction:column;flex:1.5;gap:.5rem;display:flex}#class-select-header{color:#d4af37;margin-top:0;font-size:1.2rem}.class-option{cursor:pointer;background:#2a2a2a;border:1px solid #0000;border-radius:4px;align-items:center;gap:10px;padding:10px;transition:all .2s;display:flex}.class-option:hover{background:#333;border-color:#d4af37}.class-option input[type=radio]{accent-color:#d4af37;cursor:pointer;width:18px;height:18px}.class-option label{cursor:pointer;color:#ccc;font-size:1rem}.class-option:has(input:checked){background:#3d341b;border-color:#d4af37}.class-option:has(input:checked) label{color:#fff;font-weight:700}@media (width<=600px){#class-and-stats{flex-direction:column;gap:1rem;padding:1rem}#stat-block{border-bottom:3px solid #4a6741;border-left:none;padding-bottom:1rem}#stat-block p{justify-content:space-between;font-size:1rem;display:flex}.class-option{padding:15px}}#creation-menu{color:#eee;background:#242424;border:3px solid #5c4033;border-radius:12px;max-width:500px;margin:40px auto;padding:2rem;font-family:Garamond,serif;box-shadow:0 10px 30px #000000b3}#creation-form-header{text-align:center;color:#d4af37;text-transform:uppercase;border-bottom:1px solid #5c4033;padding-bottom:1rem}#name-field{flex-direction:column;gap:.5rem;margin:1.5rem 0;display:flex}#hero-name{color:#fff;background:#111;border:1px solid #d4af37;border-radius:4px;padding:10px;font-size:1.1rem}#race-menu{grid-template-columns:1fr 1fr 1fr;gap:10px;margin-bottom:1.5rem;display:grid}.race-choice{color:#ccc;cursor:pointer;background:#333;border:1px solid #555;padding:8px;transition:all .2s}.race-choice:hover{color:#fff;border-color:#d4af37}#char-summary{background:#1a1a1a;border-left:4px solid #d4af37;min-height:50px;margin-bottom:1.5rem;padding:1rem;font-style:italic}#roll-stats-btn,#finalization-btn{letter-spacing:2px;cursor:pointer;border:none;border-radius:4px;width:100%;margin-top:10px;padding:15px;font-weight:700}#roll-stats-btn{color:#fff;background:#4a6741}#finalization-btn{color:#fff;background:#8b0000}button:disabled{cursor:not-allowed;opacity:.5;color:#666!important;background:#333!important}#class-selection-area{border:1px dashed #d4af37;margin:1rem 0;padding:1rem}@media (width<=600px){#creation-menu{max-width:95%;margin:10px auto;padding:1rem}#race-menu{grid-template-columns:1fr;gap:8px}.race-choice{padding:12px}#char-summary{padding:.8rem;font-size:.95rem}}#modal-background{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:1000;background-color:#000000d9;position:fixed;inset:0}#modal-content{z-index:1001;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}#death-modal{text-align:center;color:#fff;font-family:Garamond,serif}.death-title{color:#8b0000;text-shadow:0 0 20px #8b0000cc;margin-bottom:10px;font-size:3rem}.death-icon{margin:20px 0;font-size:5rem}.loading-bar-container{background:#333;width:100%;height:4px;margin:20px 0}.loading-bar-fill{background:#8b0000;width:0%;height:100%;animation:4s linear forwards fillBar}@keyframes fillBar{0%{width:0%}to{width:100%}}#battle-container{flex-direction:column;align-items:center;gap:20px;max-width:1200px;margin:50px auto;padding:20px;font-family:Garamond,serif;display:flex}#battle-cards{justify-content:center;gap:40px;width:100%;display:flex}#player-card{background:#1a1a1a;border:3px solid #d4af37;border-radius:12px;flex:1;padding:25px;position:relative;box-shadow:0 10px 30px #000c}.card-header{border-bottom:1px solid #d4af37;margin-bottom:20px;padding-bottom:10px}.card-header h2{color:#d4af37;text-transform:uppercase;letter-spacing:2px;margin:0;font-size:2rem}.subtitle{color:#aaa;font-size:1rem;font-style:italic}.hp-section{margin-bottom:25px}.hp-section label{color:#d4af37;font-size:.8rem;font-weight:700}.hp-bar{background:#333;border:1px solid #444;border-radius:4px;height:20px;margin-top:5px;overflow:hidden}.hp-fill{background:linear-gradient(90deg,#8b0000,red);height:100%;transition:width .5s ease-out}.stats-grid{grid-template-columns:repeat(3,1fr);gap:15px;margin-bottom:30px;display:grid}.stat-box{text-align:center;background:#252525;border:1px solid #444;border-radius:4px;padding:10px}.stat-label{color:#888;margin-bottom:5px;font-size:.7rem;display:block}.stat-value{color:#fff;font-family:Courier New,monospace;font-size:1.3rem;font-weight:700}.action-buttons{gap:15px;display:flex}.action-buttons button{cursor:pointer;text-transform:uppercase;border:2px solid #0000;flex:1;padding:12px;font-family:inherit;font-weight:700;transition:all .2s}#btn-attack{color:#fff;background:#8b0000}#btn-attack:hover{background:red;box-shadow:0 0 10px red}#btn-defend{color:#d4af37;background:#2c2c2c;border-color:#d4af37}#btn-defend:hover{color:#000;background:#d4af37}#monster-card{background:#1a1a1a;border:3px solid #8b0000;border-radius:12px;flex-direction:column;flex:1;padding:25px;display:flex;box-shadow:0 10px 40px #8b000033}.header-flex{justify-content:space-between;align-items:center;display:flex}#monster-card h3{color:#ff4d4d;text-transform:uppercase;letter-spacing:1px;margin:0}.difficulty-badge{border-radius:4px;padding:2px 8px;font-size:.7rem;font-weight:700}.common{color:#ccc;background:#444}.elite{color:#fff;background:#8b0000;box-shadow:0 0 10px #8b0000}.monster-visual{background:radial-gradient(circle,#2a1010 0%,#1a1a1a 100%);border:1px solid #333;border-radius:8px;justify-content:center;align-items:center;height:150px;margin:15px 0;display:flex}.monster-sprite{filter:drop-shadow(0 0 10px red);font-size:4rem}.monster-hp-bar{background:#000}.monster-hp-fill{background:linear-gradient(90deg,#600,red);transition:width .3s ease-out}.monster-stats{gap:15px;margin-top:auto;display:flex}.stat-pill{background:#111;border:1px solid #444;border-radius:4px;flex:1;justify-content:space-between;align-items:center;padding:8px;display:flex}.stat-pill span{color:#888;font-size:.8rem}.stat-pill strong{color:#ff4d4d}#combat-log-container{background:#0a0a0af2;border:1px solid #333;border-top:2px solid #8b0000;border-radius:4px;width:100%;overflow:hidden}.log-header{background:#1a1a1a;border-bottom:1px solid #333;justify-content:space-between;align-items:center;padding:5px 15px;display:flex}.log-header span{color:#888;letter-spacing:2px;font-size:.7rem;font-weight:700}.pulse-dot{background:red;border-radius:50%;width:6px;height:6px;animation:1.5s infinite pulse}#combat-log{flex-direction:column;gap:4px;height:150px;padding:10px 15px;font-family:Courier New,monospace;font-size:.85rem;display:flex;overflow-y:auto}.log-entry{color:#d4d4d4;border-left:2px solid #0000;margin:0;padding-left:8px;line-height:1.4}.log-entry:first-child{color:#fff;background:linear-gradient(90deg,#8b00001a 0%,#0000 100%);border-left-color:#8b0000}.log-timestamp{color:#555;margin-right:8px;font-size:.7rem}@keyframes pulse{0%{opacity:.4}50%{opacity:1}to{opacity:.4}}#combat-log::-webkit-scrollbar{width:6px}#combat-log::-webkit-scrollbar-track{background:#0a0a0a}#combat-log::-webkit-scrollbar-thumb{background:#333}@media (width<=900px){#battle-cards{flex-direction:column;align-items:center}#player-card,#monster-card{width:100%;max-width:500px}}
