body{color:#e0e0e0;background-color:#1a1a2e;flex-direction:column;align-items:center;min-height:100vh;margin:0;font-family:"Press Start 2P",cursive;display:flex;overflow:hidden}#game-container{flex-grow:1;width:100%;margin-top:10px;display:flex}#ui-panel{background-color:#2a2a3e;border-right:4px solid #4a4a5e;flex-direction:column;width:300px;padding:15px;transition:width .5s,padding .5s;display:flex;overflow-y:auto;box-shadow:5px 0 15px #00000080}#ui-panel.collapsed{width:0;min-width:0;box-shadow:none;border:none;flex-shrink:1;padding:0;overflow:hidden}#ui-panel h2{color:#ffc107;text-align:center;margin-bottom:15px;font-size:1.4em}.action-button{color:#fff;cursor:pointer;text-align:center;border:none;border-radius:8px;width:100%;margin-bottom:12px;padding:12px;font-family:"Press Start 2P",cursive;font-size:.9em;transition:background-color .3s,transform .1s;display:block}.character-button{--btn:#4caf50;--btn-hover:#45a049;--btn-active:#3e8e41;--btn-dark:#388e3c;background-color:var(--btn);box-shadow:0 4px var(--btn-dark)}.character-button:hover{background-color:var(--btn-hover)}.character-button:active{background-color:var(--btn-active);box-shadow:0 2px var(--btn-dark);transform:translateY(2px)}.character-button.warrior{--btn:#c0453a;--btn-hover:#cf544a;--btn-active:#a83a30;--btn-dark:#8c2f27}.character-button.cleric{--btn:#d9a514;--btn-hover:#e6b52b;--btn-active:#b8900f;--btn-dark:#9c7408}.character-button.wizard{--btn:#4a6fd4;--btn-hover:#5a80e2;--btn-active:#3f60bd;--btn-dark:#33509f}.character-button.selected{box-shadow:0 4px var(--btn-dark), inset 0 0 0 3px #ffffffe6, 0 0 14px #ffd75e8c;filter:brightness(1.1)}#select-hint{text-align:center;color:#9a9ab0;margin-top:12px;font-size:.6em;line-height:1.8}#start-game-button{background-color:#f44336;margin-top:10px;box-shadow:0 4px #d32f2f}#start-game-button:hover{background-color:#e53935}#start-game-button:active{background-color:#d32f2f;transform:translateY(2px);box-shadow:0 2px #c62828}#start-game-button:disabled{cursor:not-allowed;background-color:#757575;box-shadow:0 4px #555}#character-info{background-color:#1e1e2f;border:2px solid #4a4a5e;border-radius:8px;margin-top:15px;padding:12px;font-size:.85em}#character-info h3{color:#ffc107;margin-bottom:8px;font-size:1.1em}#character-info p{margin-bottom:4px;line-height:1.3}#scene-container{flex:100%;width:100%;height:calc(100vh - 20px);position:relative}canvas{border-radius:8px;width:100%;height:100%;display:block}.main-title-header{color:#ffc107;letter-spacing:.08em;text-shadow:3px 3px #000,0 0 22px #ffc10759;text-align:center;background-color:#2a2a3e;border-bottom:4px solid #4a4a5e;width:100%;padding:15px 0;font-size:2.2em;transition:opacity .5s,height .5s,padding .5s,font-size .5s}.main-title-header.hidden-title{opacity:0;border-bottom:none;height:0;padding:0;font-size:0;display:none}.hidden{display:none}@media (width<=768px){#game-container{flex-direction:column;align-items:center}#ui-panel:not(.collapsed){border-bottom:4px solid #4a4a5e;border-right:none;width:90%;max-width:400px;height:auto;margin-bottom:15px}#scene-container{width:90%;max-width:400px;height:350px}.main-title-header{font-size:1.6em}}
