html,body,#root{height:100%;margin:0;padding:0}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background:url(/bg-landing.gif) center center / cover no-repeat fixed;color:#fff}#bg-audio{position:fixed;top:16px;right:16px;z-index:1200}a{text-decoration:none;color:#fff}.container{display:flex;height:100%;overflow:hidden}.content{flex:1;margin-left:0;padding:24px;transition:margin-left .3s ease;overflow-y:auto}.sidebar{position:fixed;top:0;left:0;width:250px;height:100%;background-color:#1f1f2e;color:#fff;transform:translate(-260px);transition:transform .3s ease;z-index:1000}.sidebar.open{transform:translate(0)}.sidebar .header{display:flex;justify-content:space-between;align-items:center;padding:16px;border-bottom:1px solid #2e2e3d}.hamburger-btn{background:none;border:none;font-size:24px;color:#fff;cursor:pointer;padding:0;line-height:1}.sidebar nav{display:flex;flex-direction:column;padding:16px}.sidebar nav a{padding:12px;margin-bottom:8px;border-radius:4px;color:#fff;font-size:14px}.sidebar nav a:hover,.sidebar nav a.active{background-color:#34344e;color:#fff}.container.sidebar-open .content{margin-left:250px}.toggle-btn{position:fixed;top:16px;left:16px;z-index:1100;background:none;border:none;font-size:24px;color:#fff;cursor:pointer;transition:opacity .3s ease}.container.sidebar-open .toggle-btn{display:none}.landing{display:flex;justify-content:center;align-items:center;height:100%;overflow:hidden}.landing h1{position:relative;z-index:2;font-size:56px;color:#fff;text-shadow:0 0 8px rgba(0,0,0,.7)}.landing:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:#0000004d;z-index:1}.form-group{margin-bottom:24px}.form-group label{display:block;margin-bottom:8px;font-weight:600;font-size:16px;color:#fff}.form-group input[type=text],.form-group textarea{width:100%;padding:10px;border:1px solid #ccc;border-radius:4px;font-size:14px;color:#000}.form-group textarea{resize:vertical}.centered-step1{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:60vh;text-align:center}.centered-step1 label{font-size:2rem;margin-bottom:1rem}.centered-step1 input{width:50%;max-width:400px;font-size:1.25rem;padding:12px;margin-bottom:2rem;border-radius:4px;border:1px solid #ccc;text-align:center}.centered-step1>button{padding:14px 32px;font-size:1.125rem;font-weight:700}.card-grid.maps+button{display:block;margin:16px 0 0 auto;padding:14px 32px;font-size:1rem;font-weight:700}.card-grid.agents+button{display:block;margin:24px auto 0;padding:14px 32px;font-size:1rem;font-weight:700}.card-grid.maps{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px;justify-content:center}.card-grid.agents{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:16px}.card{position:relative;background-color:#333;border:none;border-radius:6px;overflow:hidden;cursor:pointer;transition:box-shadow .2s ease,transform .2s ease}.card-grid.maps .card{height:120px}.card-grid.agents .card{height:180px}.card img{width:100%;height:100%;object-fit:cover;display:block}.card span{position:absolute;bottom:8px;left:50%;transform:translate(-50%);color:#fff;font-weight:700;font-size:14px;background:#00000080;padding:4px 8px;border-radius:4px;pointer-events:none}.card:hover:not(.selected){box-shadow:0 0 12px 4px #a259ff;transform:translateY(-2px)}.card.selected{box-shadow:0 0 12px 4px #fff}.card.selected:hover{box-shadow:0 0 12px 4px #fff;transform:none}.view-lineup-card{position:relative;overflow:hidden}.view-lineup-card img{width:100%;height:100%;object-fit:cover;display:block}.view-lineup-card .team-name{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:1.25rem;font-weight:700;text-shadow:0 0 4px rgba(0,0,0,.9),0 0 8px rgba(0,0,0,.8),0 0 12px rgba(0,0,0,.7);z-index:2}.view-lineup-card .map-name{position:absolute;bottom:8px;right:8px;font-size:.85rem;font-weight:700;background:#00000080;padding:4px 6px;border-radius:4px;z-index:2}.card-grid.maps .view-lineup-card{height:120px}.detail-view{padding:24px}.detail-view h2{text-align:center;margin-bottom:24px}.detail-map-card{display:flex;justify-content:center;margin-bottom:24px}.detail-map-card .card{width:320px;height:160px}.detail-map-card .card span{bottom:8px;font-size:1rem;padding:4px 8px}.detail-view .card-grid.agents{justify-content:center;margin-bottom:24px}.actions{text-align:center;margin-top:24px}.actions button{margin:0 8px}button{padding:10px 20px;background-color:#1f1f2e;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:14px;font-weight:600;transition:background-color .2s ease}button:hover:not(:disabled){background-color:#34344e}button.secondary{background-color:#28a745}button.secondary:hover{background-color:#218838}button.danger{background-color:#dc3545}button.danger:hover{background-color:#bd2130}button:disabled{opacity:.5;cursor:not-allowed}.detail-view .form-group{margin-bottom:16px}
