/* First TCG visit and one-time collection hint. */
.tcg-welcome{width:min(560px,100%);margin:0 auto;text-align:center;font-family:Montserrat,sans-serif}
/* One family, three sizes: 14px spaced capitals, a 32px heading and 16px text. */
.tcg-welcome-kicker{margin:0;color:#b5b5b5;font:600 14px/1.5 Montserrat,sans-serif;letter-spacing:2px;text-transform:uppercase}
.tcg-surface .tcg-welcome h2{margin:6px 0 10px;font:700 32px/1.25 Montserrat,sans-serif;color:var(--primary-color);letter-spacing:.5px;text-transform:none}
.tcg-welcome-gift{margin:0 0 30px;font:16px/1.5 Montserrat,sans-serif;color:var(--text-color)}
.tcg-welcome-gift b{color:var(--primary-color);font-weight:600}
.tcg-welcome-step>p{margin:0 0 14px;font:16px/1.5 Montserrat,sans-serif;color:var(--text-color)}
.tcg-welcome-step[hidden]{display:none}
.tcg-welcome-actions{display:flex;justify-content:center;gap:14px}
.tcg-surface .tcg-welcome-actions button{min-width:130px;font:600 16px Montserrat,sans-serif;letter-spacing:.5px}
.tcg-surface .tcg-welcome-actions [data-welcome="yes"],.tcg-surface .tcg-welcome-actions [data-welcome="done"]{border-color:var(--secondary-color);background:var(--secondary-color);color:#fff}
.tcg-surface .tcg-welcome-actions [data-welcome="yes"]:hover,.tcg-surface .tcg-welcome-actions [data-welcome="done"]:not(:disabled):hover{filter:brightness(1.15);color:#fff}
.tcg-welcome-error{min-height:24px;margin:16px 0 0;color:#e99086;font:16px/1.5 Montserrat,sans-serif}
/* Mirrors the site search: global-leaderboard region button on the left, Riot ID input, suggestions below. */
.tcg-referral-search{position:relative;display:flex;width:min(440px,100%);height:46px;margin:0 auto 20px;border:1px solid var(--border-color);background:#171719;text-align:left}
.tcg-referral-search:focus-within{border-color:var(--primary-color)}
.tcg-surface .tcg-referral-region{display:flex;align-items:center;gap:5px;padding:0 12px;border:0;border-right:1px solid var(--border-color);background:var(--semi-transparent-bg);color:var(--text-color);font:600 14px Montserrat,sans-serif;letter-spacing:1px}
.tcg-surface .tcg-referral-region:hover,.tcg-surface .tcg-referral-region[aria-expanded="true"]{background:rgba(255,255,255,.136);color:var(--text-color)}
.tcg-referral-region svg{width:14px;height:14px;transition:transform .3s ease}
.tcg-referral-region[aria-expanded="true"] svg{transform:rotate(180deg)}
.tcg-referral-search input{flex:1;min-width:0;padding:0 14px;border:0;background:none;color:var(--text-color);font:16px Montserrat,sans-serif;outline:none}
.tcg-referral-regions,.tcg-referral-suggestions{position:absolute;top:calc(100% + 4px);z-index:3;border:1px solid var(--border-color);background:#1d1d1f;box-shadow:0 8px 20px #0008}
.tcg-referral-regions{left:-1px;display:grid;grid-template-columns:repeat(3,64px)}
.tcg-referral-suggestions{left:-1px;right:-1px;max-height:220px;overflow-y:auto}
.tcg-referral-regions[hidden],.tcg-referral-suggestions[hidden]{display:none}
.tcg-surface .tcg-referral-regions button,.tcg-surface .tcg-referral-suggestions button{display:block;width:100%;padding:9px 12px;border:0;background:none;text-align:left;font:16px Montserrat,sans-serif}
.tcg-surface .tcg-referral-regions button{font:600 14px Montserrat,sans-serif;letter-spacing:1px}
.tcg-surface .tcg-referral-regions button:hover,.tcg-surface .tcg-referral-suggestions button:hover{background:var(--highlight-color);color:var(--text-color)}
.tcg-referral-suggestions p{margin:0;padding:10px 12px;color:#aaa;font:16px Montserrat,sans-serif}
/* First empty pack stack: draw the eye to View collection once. */
.tcg-collection-flash{animation:tcg-collection-flash 1.1s ease-in-out infinite alternate}
@keyframes tcg-collection-flash{from{color:inherit;text-shadow:none}to{color:var(--primary-color);text-shadow:0 0 18px #d7a84eaa}}
@media(prefers-reduced-motion:reduce){.tcg-collection-flash{animation:none;color:var(--primary-color)}}
.tcg-collection-hint{width:max-content;max-width:min(420px,90vw);margin:10px auto 0;padding:10px 14px;border:1px solid var(--primary-color);background:#1d1a14ee;color:var(--text-color);font:14px/1.5 Montserrat,sans-serif;text-transform:none;letter-spacing:0}
.tcg-collection-hint b{color:var(--primary-color)}
