/* tip section */ .info-panel display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; margin-top: 1.2rem; gap: 12px; font-size: 0.8rem; background: rgba(0, 0, 0, 0.5); padding: 0.6rem 1.2rem; border-radius: 2rem; backdrop-filter: blur(4px);

/* loading fallback minimal */ .iframe-wrapper::before content: "⚡ LOADING 1v1.LOL ⚡"; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: rgba(255,255,200,0.6); font-size: 0.9rem; font-weight: 500; background: #0e1622; padding: 0.5rem 1rem; border-radius: 30px; z-index: 0; white-space: nowrap; font-family: monospace; pointer-events: none; letter-spacing: 1px;

/* iframe wrapper — responsive 16:9-ish but flexible */ .iframe-wrapper position: relative; width: 100%; background: #000000; border-radius: 1.8rem; overflow: hidden; box-shadow: 0 20px 35px -12px black, inset 0 1px 0 rgba(255,255,255,0.05); transition: 0.2s;

.game-frame display: block; width: 100%; height: 70vh; min-height: 480px; border: none; background: #0a0c12;

.btn background: rgba(20, 30, 44, 0.9); backdrop-filter: blur(8px); border: 1px solid rgba(72, 187, 255, 0.4); padding: 0.55rem 1.4rem; border-radius: 2rem; font-weight: 600; font-size: 0.85rem; color: #e2f0ff; cursor: pointer; transition: 0.2s; display: inline-flex; align-items: center; gap: 8px; font-family: inherit; letter-spacing: 0.3px;

@media (max-width: 500px) .game-frame height: 50vh; min-height: 320px;