.compass-play #main{max-width:1400px;margin:auto;padding:12px!important}.cq-game{padding:16px;background:#132d39;border:1px solid #557677;border-radius:20px;color:#e9f1df}.cq-game header{display:flex;justify-content:space-between;align-items:center;gap:12px}.cq-game h1{color:#f6ecd6!important;font-size:clamp(24px,3vw,36px);margin:4px 0 12px}.cq-layout{display:grid;grid-template-columns:minmax(0,1fr) 240px;gap:22px}.cq-map svg{width:100%;height:100%;max-height:55vh;min-height:300px}.cq-controls>svg{width:145px;display:block;margin:auto}.cq-bearing{text-align:center;color:#f1cf8d;font-weight:800;font-size:18px;margin:8px}.cq-pad{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.cq-pad button{display:flex;flex-direction:column;align-items:center;min-height:65px;padding:4px!important;background:#244752!important;border:1px solid #7ca59f!important;color:#edf5e8!important;border-radius:10px!important;touch-action:manipulation}.cq-pad b{font-size:25px}.cq-pad span{font-size:10px}.cq-north{grid-column:2}.cq-west{grid-row:2;grid-column:1}.cq-east{grid-row:2;grid-column:3}.cq-south{grid-row:3;grid-column:2}.cq-controls p{text-align:center;font-size:13px}.cq-controls>button{display:block;margin:auto}.cq-game .secondary{background:#244752!important;color:#e3ebdf!important;border-color:#87aba2!important;font-size:14px}.cq-message{background:#244752;border-radius:10px;padding:15px;margin-top:12px;font-size:19px;color:#f7da9b;min-height:54px}.cq-example{padding:12px;border:1px solid #8baea5;border-radius:10px;margin-top:10px}.cq-example span{display:inline-block;margin-right:16px;color:#edcf8d}.cq-example p,.cq-note{font-size:12px;color:#bdd2c8}.cq-explorer{transition:transform .2s ease-out}.cq-needle{transition:transform .2s ease-out}@media(max-width:700px){.cq-game{padding:10px}.cq-layout{grid-template-columns:minmax(0,1fr) 150px;gap:5px}.cq-map svg{min-height:260px}.cq-controls>svg{width:100px}.cq-pad{gap:3px}.cq-pad button{min-width:44px;min-height:50px}.cq-pad span{font-size:8px}.cq-bearing{font-size:14px}.cq-game h1{font-size:23px}.cq-message{font-size:15px}.cq-controls>button{font-size:12px!important}.cq-game header>button{font-size:12px!important;min-width:95px}}@media(prefers-reduced-motion:reduce){.cq-game *{transition:none!important}}