#leaderboard-name-field { position: relative; width: 100%; min-width: 0; }
#leaderboard-name-field [hidden] { display: none !important; }
#leaderboard-name-field.has-name-actions #lbname,
html.aeh-theme #start[data-front-view] #startcard #leaderboard-name-field.has-name-actions #lbname { padding-right: 40px; }
#leaderboard-name-field.has-name-save #lbname,
html.aeh-theme #start[data-front-view] #startcard #leaderboard-name-field.has-name-save #lbname { padding-right: 72px; }
#leaderboard-name-field button { position: absolute; top: 50%; transform: translateY(-50%); width: 28px; height: 34px; min-height: 0; padding: 0; margin: 0; border: 0; border-radius: 3px; background: transparent; color: #334d43; font: 500 22px/1 system-ui, sans-serif; cursor: pointer; }
#leaderboard-name-clear { right: 7px; }
#leaderboard-name-field #leaderboard-name-clear { font-size: 0; }
#leaderboard-name-clear::before,
#leaderboard-name-clear::after { content: ''; position: absolute; top: 50%; left: 50%; width: 12px; height: 1.6px; border-radius: 1px; background: currentColor; transform: translate(-50%, -50%) rotate(45deg); }
#leaderboard-name-clear::after { transform: translate(-50%, -50%) rotate(-45deg); }
#leaderboard-name-save { right: 37px; }
#leaderboard-name-field button:hover { background: #203d2712; color: #122b20; }
#leaderboard-name-field button:focus-visible { outline: 2px solid #bd984e; outline-offset: 1px; }
#leaderboard-name-field button:disabled { opacity: .5; cursor: wait; }
#leaderboard-name-field.name-taken #lbname,
html.aeh-theme #startcard #leaderboard-name-field.name-taken #lbname,
html.aeh-theme #start[data-front-view] #startcard #leaderboard-name-field.name-taken #lbname { border-color: #c92d3c; }
#lobby-name-note.name-taken,
html.aeh-theme #startcard #lobby-name-note.name-taken { color: #ff747c; }