*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;background:#eef3f7;color:#142d49;font:15px system-ui}.acceso-pendiente main{visibility:hidden}header{background:#102d50;color:white;border-top:6px solid #8dd4ed;padding:18px 4%;display:flex;align-items:center;gap:16px;flex-wrap:wrap}header img{width:52px;background:white;border-radius:50%;padding:4px}header strong{font-size:20px}#acceso-club{margin-left:auto;font-size:12px}#acceso-club form{display:flex;gap:8px;flex-wrap:wrap}main{max-width:1600px;margin:auto;padding:24px}nav,.toolbar,.heading{display:flex;align-items:center;gap:12px;flex-wrap:wrap}nav{margin-bottom:24px}nav a,a{color:#225b83;cursor:pointer}h1{font-size:32px;margin:6px 0}p{line-height:1.5;color:#53697c}.heading{justify-content:space-between;margin-bottom:22px}button,input,select{font:inherit;padding:10px 14px;border:1px solid #c8d5e1;border-radius:9px;background:white;color:#142d49}button{cursor:pointer}button:hover{border-color:#24688e}button:disabled{opacity:.5;cursor:wait}button.active,#new,#save,#play{background:#145b82;color:white}button[data-tool=blue]{color:#214ce0}button[data-tool=red]{color:#d12626}.toolbar{margin-bottom:18px}.toolbar button{font-size:13px;padding:8px 12px}#name{font-size:21px;font-weight:700;max-width:100%}#cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:20px}.card{background:white;border:1px solid #d4dfe8;border-radius:14px;overflow:hidden}.card img{width:100%;height:160px;object-fit:contain;background:#123d6c}.card h3,.card p,.card button{margin:14px}.layout{display:grid;grid-template-columns:220px 1fr;gap:22px}aside{background:white;padding:16px;border-radius:12px}aside label{display:grid;gap:6px;margin:12px 0}aside button,#download{display:block;width:100%;margin:9px 0}aside p,aside ol{font-size:12px}aside input[type=color]{width:100%}canvas{display:block;width:100%;max-height:78vh;object-fit:contain;touch-action:none;background:#102d50;border-radius:14px}#status{position:sticky;bottom:8px;background:#fff;padding:12px;border-radius:8px;min-height:44px}#hint{margin-top:0;font-size:13px}#download{padding:12px;background:#e2f3fc;text-align:center;border-radius:8px}@media(max-width:700px){main{padding:12px}.layout{grid-template-columns:1fr}aside{display:flex;flex-wrap:wrap;gap:8px;align-items:center}aside h3,aside p,aside ol{width:100%}aside button,aside label,#download{width:auto;margin:0}canvas{max-height:65vh}h1{font-size:25px}}

canvas{max-height:none!important;height:auto}

/* Barra superior según la referencia del club. */
header{background:linear-gradient(110deg,#09282f,#114b54);border-top:0;padding:24px 2%;gap:14px}header strong{font-size:21px;flex:1;min-width:210px}header .club-nav{display:flex;flex-wrap:nowrap;gap:8px;margin:0;padding:12px 18px;border:2px solid #ffffff12;border-radius:32px;background:#ffffff20;align-items:center}header .club-nav a,header .club-nav button{display:flex;align-items:center;gap:12px;white-space:nowrap;color:#c5d3d7;font-size:20px;font-weight:650;text-decoration:none;background:transparent;border:0;border-radius:15px;padding:12px 16px;cursor:pointer}header .club-nav span{font-size:27px;font-weight:400}header .club-nav [aria-current=page]{background:#ffffff12;color:#fff}header .club-nav a:hover{background:#ffffff19}header .club-nav button:disabled{opacity:.65;cursor:default}#acceso-club{width:100%;text-align:right}@media(max-width:1150px){header .club-nav{width:100%;overflow-x:auto;justify-content:space-between}header .club-nav a,header .club-nav button{font-size:16px;padding:10px}header .club-nav span{font-size:23px}}@media(max-width:650px){header .club-nav{border-radius:20px;justify-content:flex-start}header .club-nav a,header .club-nav button{font-size:14px;gap:7px}}

#drawing-palette{display:flex;flex-wrap:wrap;gap:8px}#drawing-palette button{width:30px;height:30px;min-width:30px;padding:0;border:2px solid #8a9db0;border-radius:50%;margin:0}#drawing-palette button[aria-pressed=true]{outline:3px solid #145b82;outline-offset:2px}#drawing-colors{width:100%}

#movement-path-control{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin:14px 0;padding:14px 18px;background:#fff;border:2px solid #6aa7c3;border-radius:12px}#movement-path-control button{margin:0;min-width:110px}#movement-path-control button[aria-pressed=true]{background:#145b82;color:#fff;border-color:#145b82}#movement-path-control span{color:#476079}
