*{box-sizing:border-box;font-family:Segoe UI,system-ui,sans-serif}body{background:#2c2c2c;justify-content:center;align-items:center;height:100vh;margin:0;display:flex}.game-screen{color:#2a3a4b;background:#f4f6fa;border-radius:18px;width:350px;height:700px;position:relative;overflow:hidden;box-shadow:0 20px 50px #0006}.left{float:left!important}.right{float:right!important}.hide{visibility:hidden!important;display:none!important}.transparent{background:0 0!important}.top-bar{background:#fff;border-bottom:1px solid #e0e6ef;flex-direction:column;align-items:center;width:100%;padding:5px;font-size:12px;font-weight:700;display:flex;position:absolute;top:0}.auth-section{align-items:center;gap:10px;display:flex}.user-info{align-items:center;gap:5px;display:flex}.user-picture{border-radius:50%;width:24px;height:24px}.login-btn{color:#fff;cursor:pointer;background:#4285f4;border:none;border-radius:4px;padding:4px 8px;font-size:12px}.resources{justify-content:space-around;width:100%;margin-top:5px;display:flex}.res{color:#2a3a4b;background:0 0;border-radius:0;margin:2px 0;padding:0;font-size:11px;display:block}.level{color:#fff;background:#4f8cff;border-radius:14px;padding:6px 12px;font-size:13px;font-weight:700}.main-area{height:calc(100% - 200px);margin-top:50px;padding:10px;overflow-y:auto}.tab-container{margin-bottom:20px}.tab-buttons{gap:0;margin-top:0;margin-bottom:0;padding-top:0;padding-bottom:0;display:flex}.tab-btn{cursor:pointer;background:#e0e6ef;border:none;border-radius:6px;padding:6px 10px;font-size:12px}.tab-btn.active{color:#fff;background:#4f8cff}.tab-content{display:none}.tab-content.active{display:block}.button-group{grid-template-columns:repeat(2,1fr);gap:10px;display:grid}.action-btn{color:#fff;cursor:pointer;background:#4f8cff;border:none;border-radius:8px;padding:12px;font-size:14px;transition:background .2s}.action-btn:hover{background:#3466c2}.timeline{text-align:center;color:#6b7a8f;background:#fff;border-radius:8px;margin-bottom:20px;padding:10px;font-size:14px}.character-management{background:#fff;border-radius:8px;margin-bottom:20px;padding:8px;font-size:11px}.character-management h3{margin-top:0;font-size:14px}.char-mgmt-content{flex-direction:column;gap:5px;display:flex}.char-selector,.create-char{align-items:center;gap:5px;display:flex}.char-selector select,.create-char input{flex:1;padding:4px;font-size:11px}.create-char span{font-size:10px}.character-sheet{background:#fff;border-radius:8px;margin-bottom:20px;padding:8px;font-size:11px;line-height:1.2}.character-sheet h3{color:#3a4a5b;margin-top:0;font-size:14px}.character-sheet h4{margin:4px 0 2px;font-size:12px;font-weight:700}.stats-grid{gap:10px;margin:8px 0;display:flex}.stat-column{text-align:left;flex:1}.character-sheet .resources{flex-direction:column;gap:2px;display:flex}.character-sheet .stat-label{font-weight:700}.character-sheet .stat-value{color:#4f8cff}.character-sheet p{margin:2px 0}.character-sheet ul{margin:2px 0;padding-left:15px}.character-sheet li{margin:1px 0}.event-inbox{background:#fff;border-radius:8px;min-height:50px;margin-bottom:20px;padding:12px;font-size:14px}.event-inbox ul{margin:0;padding:0;list-style:none}.event-inbox li{color:#2a3a4b;word-wrap:break-word;background:#e0e6ef;border-radius:18px;max-width:80%;margin-bottom:8px;padding:8px 12px;position:relative}.event-inbox li:before{content:"";border-top:8px solid #e0e6ef;border-left:8px solid #0000;border-right:8px solid #0000;width:0;height:0;position:absolute;bottom:-8px;left:12px}.side-buttons{flex-direction:column;gap:10px;display:flex;position:absolute;top:80px;right:10px}.btn{color:#fff;cursor:pointer;background:#111;border-radius:50%;place-items:center;width:44px;height:44px;font-size:18px;display:grid;box-shadow:0 4px 8px #0006}.btn-menu{color:#fffffff2;cursor:pointer;background:#0006;border-radius:50%;place-items:center;width:44px;height:44px;font-size:18px;display:grid;box-shadow:0 4px 8px #0006}.bottom-banner{color:#fff;text-align:center;letter-spacing:1px;background:#5b2d1f;flex-direction:column;align-items:center;width:100%;height:150px;padding:10px;font-size:14px;font-weight:700;display:flex;position:absolute;bottom:0;overflow-y:auto}.bottom-banner .tab-container{width:100%}.bottom-banner .tab-buttons{justify-content:center;gap:10px;margin-bottom:10px;display:flex}.bottom-banner .tab-btn{cursor:pointer;color:#fff;background:#7c3aed;border:none;border-radius:6px;padding:6px 12px;font-size:12px}.bottom-banner .tab-btn.active{background:#4f8cff}.bottom-banner .tab-content{display:none}.bottom-banner .tab-content.active{display:block}.bottom-banner .button-group{grid-template-columns:repeat(4,1fr);gap:8px;width:100%;max-width:360px;display:grid}.bottom-banner .action-btn{color:#fff;cursor:pointer;background:#4f8cff;border:none;border-radius:8px;padding:8px;font-size:12px;transition:background .2s}