/* WIGUEL Players */

/* Header button */
.wgp-chip {
	display: inline-flex; align-items: center; gap: .5rem; margin-left: auto; margin-right: .8rem; padding: .38rem .8rem .38rem .4rem;
	border: 0; border-radius: 999px; cursor: pointer; color: #e9ebfa; font: 700 .85rem/1 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	background: rgba(15, 17, 36, .8); box-shadow: inset 0 0 0 1px rgba(148, 163, 255, .28);
	transition: box-shadow .25s ease, transform .2s ease;
}
.wgp-chip:hover { box-shadow: inset 0 0 0 1px #22d3ee, 0 0 18px rgba(34, 211, 238, .4); }
.wgp-chip:active { transform: scale(.97); }
.wgp-chip__av, .wgp-chip__icon {
	display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; font-weight: 900; font-size: .85rem; color: #04121a;
	background: linear-gradient(135deg, #22d3ee, #8b5cf6); box-shadow: 0 0 12px rgba(34, 211, 238, .55);
}
.wgp-chip__icon { background: rgba(34, 211, 238, .14); box-shadow: inset 0 0 0 1.5px #22d3ee; position: relative; }
.wgp-chip__icon::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: #22d3ee; transform: translateY(-3px); }
.wgp-chip__icon::after { content: ""; position: absolute; bottom: 6px; width: 15px; height: 7px; border-radius: 8px 8px 2px 2px; background: #22d3ee; }
.wgp-chip__name { max-width: 9rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (min-width: 761px) { .wgp-chip { order: 2; margin-left: 1.2rem; margin-right: 0; } .site-header__inner { gap: 0; } }
@media (max-width: 420px) { .wgp-chip__name { max-width: 5.5rem; } }

/* Dialog */
.wgp-dlg {
	width: min(440px, calc(100vw - 24px)); max-height: calc(100dvh - 24px); overflow: auto; padding: 1.6rem 1.5rem 1.5rem; border: 0; border-radius: 24px; color: #e9ebfa;
	background: radial-gradient(120% 60% at 50% 0%, rgba(34, 211, 238, .14), transparent 60%), linear-gradient(180deg, #14163a, #0a0b1c);
	box-shadow: 0 0 0 1px rgba(148, 163, 255, .28), 0 40px 100px -20px rgba(0, 0, 0, .9), 0 0 60px -10px rgba(139, 92, 246, .5);
	font: 400 1rem/1.5 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
.wgp-dlg::backdrop { background: rgba(4, 4, 12, .72); backdrop-filter: blur(4px); }
.wgp-dlg[open] { animation: wgp-in .35s cubic-bezier(.2, .9, .3, 1.2); }
@keyframes wgp-in { from { opacity: 0; transform: translateY(18px) scale(.96); } }
.wgp-x { position: absolute; top: .7rem; right: .8rem; width: 36px; height: 36px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .06); color: #c7cbea; font-size: 1.4rem; line-height: 1; cursor: pointer; }
.wgp-x:hover { background: rgba(255, 255, 255, .12); color: #fff; }
.wgp-title { margin: 0 0 .3rem; font-size: 1.6rem; font-weight: 900; letter-spacing: -.02em; }
.wgp-lead { margin: 0 0 1rem; color: #a3a9c9; font-size: .95rem; }
.wgp-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: .3rem; padding: .3rem; margin-bottom: 1.1rem; border-radius: 14px; background: rgba(7, 7, 15, .6); box-shadow: inset 0 0 0 1px rgba(148, 163, 255, .16); }
.wgp-tab { padding: .6rem .4rem; border: 0; border-radius: 10px; background: none; color: #a3a9c9; font: 800 .82rem/1 system-ui, sans-serif; letter-spacing: .04em; cursor: pointer; }
.wgp-tab[aria-pressed="true"] { color: #04121a; background: linear-gradient(135deg, #22d3ee, #8b5cf6); box-shadow: 0 0 16px rgba(34, 211, 238, .45); }
.wgp-form { display: flex; flex-direction: column; gap: .9rem; }
.wgp-field { display: flex; flex-direction: column; gap: .35rem; }
.wgp-field__label { font: 800 .7rem/1 ui-monospace, Menlo, Consolas, monospace; letter-spacing: .2em; text-transform: uppercase; color: #8f96c2; }
.wgp-row { display: flex; gap: .5rem; }
.wgp-input {
	width: 100%; min-width: 0; padding: .8rem .9rem; border: 0; border-radius: 12px; color: #fff; font: 700 1.05rem/1.2 system-ui, sans-serif;
	background: rgba(7, 7, 15, .75); box-shadow: inset 0 0 0 1px rgba(148, 163, 255, .25); outline: none; transition: box-shadow .2s ease;
}
.wgp-input:focus { box-shadow: inset 0 0 0 2px #22d3ee, 0 0 18px rgba(34, 211, 238, .3); }
.wgp-pin { font: 900 1.5rem/1 ui-monospace, Menlo, Consolas, monospace; letter-spacing: .6em; text-align: center; padding-left: 1.2rem; }
.wgp-pins { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; }
.wgp-dice { flex: none; width: 50px; border: 0; border-radius: 12px; font-size: 1.35rem; cursor: pointer; background: rgba(139, 92, 246, .18); box-shadow: inset 0 0 0 1px rgba(139, 92, 246, .5); transition: transform .3s cubic-bezier(.2, 1.6, .4, 1); }
.wgp-dice:hover { transform: rotate(-18deg) scale(1.08); }
.wgp-hint { min-height: 1.1em; font-size: .82rem; color: #8f96c2; }
.wgp-hint.is-ok { color: #34d399; } .wgp-hint.is-bad { color: #fb7185; }
.wgp-warn { margin: 0; padding: .7rem .85rem; border-radius: 12px; font-size: .84rem; line-height: 1.45; color: #fde68a; background: rgba(251, 191, 36, .08); box-shadow: inset 0 0 0 1px rgba(251, 191, 36, .28); }
.wgp-msg { margin: 0; min-height: 0; color: #fb7185; font-size: .9rem; font-weight: 600; }
.wgp-msg:empty { display: none; }
.wgp-go { width: 100%; justify-content: center; }
.wgp-go.is-busy, .wgp-danger.is-busy { opacity: .6; pointer-events: none; }
.wgp-me { display: flex; align-items: center; gap: 1rem; padding: 1rem; margin: .4rem 0 1rem; border-radius: 16px; background: rgba(7, 7, 15, .55); box-shadow: inset 0 0 0 1px rgba(148, 163, 255, .2); }
.wgp-me__av { display: grid; place-items: center; width: 56px; height: 56px; flex: none; border-radius: 50%; font-size: 1.5rem; font-weight: 900; color: #04121a; background: linear-gradient(135deg, #22d3ee, #8b5cf6); box-shadow: 0 0 22px rgba(34, 211, 238, .55); }
.wgp-me__info { display: flex; flex-direction: column; min-width: 0; }
.wgp-me__label { font: 800 .66rem/1 ui-monospace, Menlo, monospace; letter-spacing: .22em; text-transform: uppercase; color: #22d3ee; }
.wgp-me__name { font-size: 1.45rem; font-weight: 900; overflow: hidden; text-overflow: ellipsis; }
.wgp-me__stat { font-size: .82rem; color: #a3a9c9; }
.wgp-acts { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
.wgp-acts .btn { justify-content: center; padding: .8rem .6rem; font-size: .8rem; }
.wgp-del { margin-top: 1.1rem; }
.wgp-del summary { cursor: pointer; color: #8f96c2; font-size: .85rem; }
.wgp-del .wgp-form { margin-top: .8rem; }
.wgp-danger { padding: .8rem; border: 0; border-radius: 12px; cursor: pointer; font: 800 .85rem/1 system-ui, sans-serif; letter-spacing: .06em; text-transform: uppercase; color: #fff; background: linear-gradient(180deg, #e11d48, #9f1239); }
.wgp-prof { margin-top: .35rem; color: #c7cbea; font-size: .95rem; }
.wgp-prof b { color: #fff; }
.wgp-link { padding: 0; border: 0; background: none; color: #22d3ee; font: inherit; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
@media (prefers-reduced-motion: reduce) { .wgp-dlg[open] { animation: none; } }
@media (min-width: 761px) { .site-header__inner { justify-content: flex-start; } .site-header__inner .primary-nav { margin-left: auto; } }

.wgp-tour { margin: 2.4rem 0 0; }
.wgp-tour .wg-ach { margin-top: 1rem; }
.wgp-tour__list { margin: 1rem 0 0; padding-left: 1.2rem; color: #a3a9c9; font-size: .92rem; }
.wgp-tour__list a { color: #22d3ee; font-weight: 700; }
.wgp-country { font-size: .95rem; cursor: pointer; }
.wgp-country option { color: #0b0c1a; background: #fff; }
