html[data-site="ls"] .lsp { display: flex; flex-direction: column; gap: 10px; color: var(--ls-text); font-family: var(--ls-font); line-height: 1.3; }
html[data-site="ls"] .lsp-card { background: var(--ls-card); border: 1px solid var(--ls-card-edge, var(--ls-line)); border-radius: 16px; padding: 14px 16px; min-width: 0; }
html[data-site="ls"] .lsp-card h2 { display: flex; align-items: center; gap: 9px; margin: 0 0 12px; font-size: 18px; font-weight: 900; color: var(--ls-text); }
html[data-site="ls"] .lsp-card h2 .ls-icon { width: 22px; height: 22px; color: var(--ls-brand, var(--ls-accent)); }
html[data-site="ls"] .lsp-head { display: grid; grid-template-columns: auto minmax(0, 1fr) minmax(260px, 1.3fr); gap: 18px; align-items: center; }
html[data-site="ls"] .lsp-ring { padding: 3px; border-radius: 50%; background: linear-gradient(135deg, var(--ls-btn-top), var(--ls-btn-bottom)); }
html[data-site="ls"] .lsp-ring .ls-avatar { width: 84px; height: 84px; font-size: 34px; border: 3px solid var(--ls-card); }
html[data-site="ls"] .lsp-id h1 { margin: 0; font-size: 26px; font-weight: 900; letter-spacing: -.4px; color: var(--ls-text); }
html[data-site="ls"] .lsp-id p { margin: 4px 0 0; color: var(--ls-muted); font-weight: 700; }
html[data-site="ls"] .lsp-xp-line { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; font-size: 12.5px; color: var(--ls-muted); }
html[data-site="ls"] .lsp-xp-line b { font-size: 17px; font-weight: 900; color: var(--ls-text); white-space: nowrap; }
html[data-site="ls"] .lsp-bar { height: 10px; margin: 6px 0; border-radius: 7px; background: var(--ls-field); border: 1px solid var(--ls-line); overflow: hidden; }
html[data-site="ls"] .lsp-bar i { display: block; height: 100%; border-radius: 7px; background: linear-gradient(90deg, var(--ls-btn-bottom), var(--ls-btn-top)); }
html[data-site="ls"] .lsp-streak { display: flex; align-items: center; gap: 6px; margin: 0; font-size: 12.5px; color: var(--ls-muted); }
html[data-site="ls"] .lsp-streak .ls-icon { width: 16px; height: 16px; color: #f97316; }
html[data-site="ls"] .lsp-msg { margin: 0; padding: 9px 14px; border-radius: 10px; background: color-mix(in srgb, #22c55e 18%, var(--ls-card)); color: var(--ls-text); font-weight: 700; }
html[data-site="ls"] .lsp-msg-error { background: color-mix(in srgb, #ef4444 18%, var(--ls-card)); }
html[data-site="ls"] .lsp-cols { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 10px; align-items: start; }
html[data-site="ls"] .lsp-side { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
html[data-site="ls"] .lsp-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 8px; }
html[data-site="ls"] .lsp-tile { position: relative; display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 8px 4px; border-radius: 12px; border: 1px solid var(--ls-line); background: var(--ls-field); cursor: pointer; text-align: center; font-size: 12px; font-weight: 700; }
html[data-site="ls"] .lsp-tile input { position: absolute; opacity: 0; pointer-events: none; }
html[data-site="ls"] .lsp-tile img { width: 64px; height: 64px; border-radius: 50%; }
html[data-site="ls"] .lsp-tile:has(input:checked) { border-color: var(--ls-brand, var(--ls-accent)); box-shadow: 0 0 0 2px var(--ls-brand, var(--ls-accent)); }
html[data-site="ls"] .lsp-tile:has(input:focus-visible) { outline: 2px solid var(--ls-brand, var(--ls-accent)); outline-offset: 2px; }
html[data-site="ls"] .lsp-tile.is-locked { cursor: not-allowed; }
html[data-site="ls"] .lsp-tile.is-locked img { filter: grayscale(1); opacity: .35; }
html[data-site="ls"] .lsp-tile em { display: flex; align-items: center; gap: 3px; font-style: normal; font-weight: 600; font-size: 10.5px; color: var(--ls-muted); line-height: 1.15; }
html[data-site="ls"] .lsp-tile em .ls-icon { width: 12px; height: 12px; flex: none; }
html[data-site="ls"] .lsp-other { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--ls-line); }
html[data-site="ls"] .lsp-opt { display: flex; align-items: center; gap: 8px; font-weight: 700; cursor: pointer; }
html[data-site="ls"] .lsp-opt small { display: block; font-weight: 500; font-size: 11px; color: var(--ls-muted); }
html[data-site="ls"] .lsp-opt .ls-icon { width: 20px; height: 20px; color: var(--ls-muted); }
html[data-site="ls"] .lsp-file { max-width: 100%; color: var(--ls-muted); font-size: 12px; }
html[data-site="ls"] .lsp-save { margin-left: auto; height: 36px; padding: 0 18px; border: 0; border-radius: 10px; background: linear-gradient(135deg, var(--ls-btn-top), var(--ls-btn-bottom)); color: var(--ls-btn-ink); font: 800 14px var(--ls-font); cursor: pointer; }
html[data-site="ls"] .lsp-badges { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px 6px; margin: 0; padding: 0; list-style: none; text-align: center; }
html[data-site="ls"] .lsp-badge { position: relative; display: flex; flex-direction: column; align-items: center; gap: 2px; font-size: 12px; }
html[data-site="ls"] .lsp-hex { width: 54px; height: 60px; filter: drop-shadow(0 0 8px var(--b1)); }
html[data-site="ls"] .lsp-glyph { position: absolute; top: 15px; left: 50%; transform: translateX(-50%); color: #ffffff; filter: drop-shadow(0 0 5px var(--b1)); }
html[data-site="ls"] .lsp-glyph .ls-icon { width: 24px; height: 24px; }
html[data-site="ls"] .lsp-badge b { font-weight: 900; }
html[data-site="ls"] .lsp-badge small { color: var(--ls-muted); font-weight: 700; }
html[data-site="ls"] .lsp-badge.is-locked .lsp-hex, html[data-site="ls"] .lsp-badge.is-locked .lsp-glyph { filter: grayscale(1); opacity: .4; }
html[data-site="ls"] .lsp-badge-bar { width: 70%; height: 4px; border-radius: 3px; background: var(--ls-field); overflow: hidden; }
html[data-site="ls"] .lsp-badge-bar i { display: block; height: 100%; background: linear-gradient(90deg, var(--b2), var(--b1)); }
html[data-site="ls"] .lsp-badge-desc { font-size: 10.5px; color: var(--ls-muted); }
html[data-site="ls"] .lsp-history { margin: 0; padding: 0; list-style: none; }
html[data-site="ls"] .lsp-history li { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 10px; align-items: center; padding: 6px 0; border-top: 1px solid var(--ls-line); font-size: 13px; }
html[data-site="ls"] .lsp-history li:first-child { border-top: 0; }
html[data-site="ls"] .lsp-history time { color: var(--ls-muted); font-size: 12px; font-variant-numeric: tabular-nums; }
html[data-site="ls"] .lsp-history b { font-weight: 900; color: color-mix(in srgb, var(--ls-brand, var(--ls-accent)) 60%, var(--ls-text)); }
html[data-site="ls"] .lsp-empty, html[data-site="ls"] .lsp-note { margin: 0; color: var(--ls-muted); font-size: 12px; }
html[data-site="ls"] .lsp-credits { margin: 0; padding-left: 18px; color: var(--ls-muted); font-size: 11.5px; }
html[data-site="ls"] .lsh-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 8px; }
html[data-site="ls"] .lsh-card { display: grid; grid-template-columns: 96px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 8px; border-radius: 12px; border: 1px solid var(--ls-line); background: var(--ls-field); color: var(--ls-text); text-decoration: none; }
html[data-site="ls"] .lsh-card:hover { border-color: var(--ls-brand, var(--ls-accent)); }
html[data-site="ls"] .lsh-photo { display: block; width: 96px; height: 64px; border-radius: 9px; overflow: hidden; background: var(--ls-line); }
html[data-site="ls"] .lsh-photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
html[data-site="ls"] .lsh-text { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
html[data-site="ls"] .lsh-text b { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-weight: 800; font-size: 14px; line-height: 1.25; }
html[data-site="ls"] .lsh-text small { color: var(--ls-muted); font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html[data-site="ls"] .lsh-xp { height: 26px; padding: 0 10px; border-radius: 8px; display: flex; align-items: center; font-weight: 900; font-size: 13px; background: linear-gradient(135deg, var(--ls-btn-top), var(--ls-btn-bottom)); color: var(--ls-btn-ink); white-space: nowrap; }
html[data-site="ls"] .lsh-subject { margin: 0 0 10px; color: var(--ls-muted); }
html[data-site="ls"] .lsh-subject a { color: var(--ls-link); font-weight: 700; }
html[data-site="ls"] .lsh-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px 14px; }
html[data-site="ls"] .lsh-form label { display: flex; flex-direction: column; gap: 4px; font-weight: 700; font-size: 13px; }
html[data-site="ls"] .lsh-form label small { font-weight: 500; color: var(--ls-muted); }
html[data-site="ls"] .lsh-form input, html[data-site="ls"] .lsh-form select { height: 36px; padding: 0 10px; border-radius: 9px; border: 1px solid var(--ls-field-edge, var(--ls-line)); background: var(--ls-field); color: var(--ls-text); font: 500 13px var(--ls-font); }
html[data-site="ls"] .lsh-actions { grid-column: 1 / -1; display: flex; gap: 10px; justify-content: flex-end; }
html[data-site="ls"] .lsh-actions .lsp-save { margin-left: 0; }
html[data-site="ls"] .lsh-remove { height: 36px; padding: 0 16px; border-radius: 10px; border: 1px solid var(--ls-line); background: transparent; color: var(--ls-text); font: 700 14px var(--ls-font); cursor: pointer; }
html[data-site="ls"] .lsx { --lsx-pink: #ff3d9a; --lsx-violet: #8b5cf6; --lsx-cyan: #38bdf8; --lsx-gold: #fbbf24; --lsx-sel: var(--ls-brand, var(--ls-accent)); display: flex; flex-direction: column; gap: 12px; container-type: inline-size; }
html[data-site="ls"] .lsx-hero { display: grid; grid-template-columns: minmax(0, 400px) minmax(0, 1fr); gap: 10px; }
html[data-site="ls"] .lsx-stage { position: relative; overflow: hidden; border-radius: 16px; border: 1px solid var(--ls-card-edge, var(--ls-line)); background: radial-gradient(circle at 50% 36%, color-mix(in srgb, var(--fx, #ff3d9a) 24%, transparent) 0%, transparent 58%), linear-gradient(180deg, #1a1d45, #111430); padding: 28px 16px 16px; display: flex; flex-direction: column; align-items: center; gap: 12px; color: #f3f4fc; }
html[data-site="ls"] .lsx-stage::before { content: ""; position: absolute; inset: auto 0 0; height: 46%; background: repeating-linear-gradient(90deg, rgba(255, 255, 255, .035) 0 1px, transparent 1px 44px), repeating-linear-gradient(0deg, rgba(255, 255, 255, .035) 0 1px, transparent 1px 22px); -webkit-mask: linear-gradient(transparent, #000 70%); mask: linear-gradient(transparent, #000 70%); pointer-events: none; }
html[data-site="ls"] .lsx-stage-av { position: relative; padding: 26px; display: flex; justify-content: center; }
html[data-site="ls"] .lsx-stage-av > .ls-avatar { width: 250px; height: 250px; font-size: 90px; }
html[data-site="ls"] .lsx-trial { position: absolute; top: 10px; left: 10px; right: 10px; z-index: 8; display: flex; gap: 6px; align-items: center; justify-content: center; padding: 6px 10px; border-radius: 10px; background: rgba(12, 15, 34, .82); border: 1px solid rgba(251, 191, 36, .55); color: var(--lsx-gold); font-weight: 800; font-size: 12.5px; text-align: center; }
html[data-site="ls"] .lsx-trial[hidden], html[data-site="ls"] .lsx-random[hidden] { display: none; }
html[data-site="ls"] .lsx-trial svg { width: 14px; height: 14px; flex: none; }
html[data-site="ls"] .lsx-who { position: relative; text-align: center; }
html[data-site="ls"] .lsx-who h1 { margin: 0; font-size: 28px; font-weight: 900; letter-spacing: -.4px; color: #f3f4fc; }
html[data-site="ls"] .lsx-who p { margin: 3px 0 0; color: #a3a9cc; font-weight: 700; }
html[data-site="ls"] .lsx-who p span { color: var(--lsx-gold); }
html[data-site="ls"] .lsx-contexts { position: relative; display: flex; flex-wrap: wrap; gap: 14px; align-items: flex-end; justify-content: center; width: 100%; padding-top: 12px; border-top: 1px solid rgba(173, 182, 255, .14); }
html[data-site="ls"] .lsx-contexts:empty { display: none; }
html[data-site="ls"] .lsx-ctx { display: flex; flex-direction: column; align-items: center; gap: 6px; color: #a3a9cc; font-size: 11.5px; font-weight: 700; }
html[data-site="ls"] .lsx-ctx-post { display: flex; align-items: center; gap: 8px; padding: 6px 10px 6px 6px; border-radius: 12px; background: rgba(255, 255, 255, .05); border: 1px solid rgba(173, 182, 255, .14); }
html[data-site="ls"] .lsx-ctx-post b { display: block; color: #f3f4fc; font-size: 12.5px; }
html[data-site="ls"] .lsx-ctx-post small { display: block; color: #a3a9cc; font-size: 11px; font-weight: 600; }
html[data-site="ls"] .lsx-side { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
html[data-site="ls"] .lsx-xp-top { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; flex-wrap: wrap; }
html[data-site="ls"] .lsx-xp-top h2 { margin: 0; font-size: 21px; font-weight: 900; color: var(--ls-text); }
html[data-site="ls"] .lsx-xp-top h2 em { font-style: normal; color: var(--lsx-sel); }
html[data-site="ls"] .lsx-xp-top b { font-size: 19px; font-weight: 900; font-variant-numeric: tabular-nums; color: var(--ls-text); white-space: nowrap; }
html[data-site="ls"] .lsx-xp-sub { display: flex; justify-content: space-between; gap: 6px 12px; flex-wrap: wrap; color: var(--ls-muted); font-size: 12.5px; font-weight: 600; }
html[data-site="ls"] .lsx-next { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 10px; }
html[data-site="ls"] .lsx-next > span { color: var(--ls-muted); font-size: 12.5px; font-weight: 700; }
html[data-site="ls"] .lsx-next-item { display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px 3px 3px; border-radius: 999px; background: var(--ls-field); border: 1px solid var(--ls-line); font-size: 12px; font-weight: 700; color: var(--ls-text); }
html[data-site="ls"] .lsx-next-item img, html[data-site="ls"] .lsx-next-item i { width: 24px; height: 24px; border-radius: 50%; object-fit: cover; background: #0b0e20; }
html[data-site="ls"] .lsx-next-item.is-acc img { object-fit: contain; padding: 3px; }
html[data-site="ls"] .lsx-next-item i { display: block; background: conic-gradient(#ff3d9a, #8b5cf6, #38bdf8, #ff3d9a); }
html[data-site="ls"] .lsx-compo { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
html[data-site="ls"] .lsx-compo:empty { display: none; }
html[data-site="ls"] .lsx-slot { display: flex; flex-direction: column; gap: 7px; align-items: flex-start; min-width: 0; padding: 10px; border-radius: 12px; border: 1px solid var(--ls-line); background: var(--ls-field); color: var(--ls-text); text-align: left; cursor: pointer; font: inherit; }
html[data-site="ls"] .lsx-slot:hover { border-color: var(--lsx-sel); }
html[data-site="ls"] .lsx-slot small { color: var(--ls-muted); font-size: 10.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
html[data-site="ls"] .lsx-slot b { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; font-weight: 800; }
html[data-site="ls"] .lsx-thumb { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; overflow: hidden; background: #0b0e20; border: 1px solid var(--ls-line); flex: none; }
html[data-site="ls"] .lsx-thumb img { width: 100%; height: 100%; object-fit: cover; }
html[data-site="ls"] .lsx-thumb.is-contain img { width: 70%; height: 70%; object-fit: contain; }
html[data-site="ls"] .lsx-coll-head { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; flex-wrap: wrap; margin-bottom: 10px; }
html[data-site="ls"] .lsx-coll-head h3 { margin: 0; font-size: 17px; font-weight: 900; color: var(--ls-text); }
html[data-site="ls"] .lsx-coll-head span { color: var(--ls-muted); font-size: 12.5px; font-weight: 700; }
html[data-site="ls"] .lsx-coll { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
html[data-site="ls"] .lsx-coll-row { display: flex; flex-direction: column; gap: 5px; color: var(--ls-muted); font-size: 12.5px; font-weight: 700; }
html[data-site="ls"] .lsx-coll-row b { color: var(--ls-text); font-size: 19px; font-weight: 900; font-variant-numeric: tabular-nums; }
html[data-site="ls"] .lsx-coll-row b small { color: var(--ls-muted); font-size: 12.5px; font-weight: 700; }
html[data-site="ls"] .lsx-coll-bar { height: 6px; border-radius: 4px; background: var(--ls-field); overflow: hidden; }
html[data-site="ls"] .lsx-coll-bar i { display: block; height: 100%; border-radius: 4px; }
html[data-site="ls"] .lsx-coll-0 i { background: linear-gradient(90deg, #ff3d9a, #ff8fc6); }
html[data-site="ls"] .lsx-coll-1 i { background: linear-gradient(90deg, #8b5cf6, #c4b5fd); }
html[data-site="ls"] .lsx-coll-2 i { background: linear-gradient(90deg, #38bdf8, #a5f3fc); }
html[data-site="ls"] .lsx-coll-3 i { background: linear-gradient(90deg, #fbbf24, #fde68a); }
html[data-site="ls"] .lsx-form { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 0; }
html[data-site="ls"] .lsx-btn { height: 40px; padding: 0 18px; border-radius: 10px; border: 0; cursor: pointer; font: 800 14px var(--ls-font); }
html[data-site="ls"] .lsx-btn-main { background: linear-gradient(135deg, var(--ls-btn-top), var(--ls-btn-bottom)); color: var(--ls-btn-ink); }
html[data-site="ls"] .lsx-btn-main:disabled { background: var(--ls-field); color: var(--ls-muted); border: 1px solid var(--ls-line); cursor: not-allowed; }
html[data-site="ls"] .lsx-btn-ghost { background: transparent; border: 1px solid var(--ls-line); color: var(--ls-text); }
html[data-site="ls"] .lsx-foot { display: flex; justify-content: flex-end; margin-top: 14px; }
html[data-site="ls"] .lsx-foot[hidden] { display: none; }
html[data-site="ls"] .lsx-tabs { position: sticky; top: 0; z-index: 20; display: flex; gap: 6px; padding: 6px; border-radius: 14px; background: color-mix(in srgb, var(--ls-card) 92%, transparent); border: 1px solid var(--ls-card-edge, var(--ls-line)); backdrop-filter: blur(10px); overflow-x: auto; scrollbar-width: none; }
html[data-site="ls"] .lsx-tab { flex: 1 0 auto; display: flex; gap: 8px; align-items: center; justify-content: center; height: 40px; padding: 0 16px; border: 0; border-radius: 10px; background: transparent; color: var(--ls-muted); font: 800 14px var(--ls-font); cursor: pointer; }
html[data-site="ls"] .lsx-tab span { padding: 1px 7px; border-radius: 999px; background: var(--ls-field); font-size: 11.5px; }
html[data-site="ls"] .lsx-tab[aria-selected="true"] { background: linear-gradient(135deg, var(--ls-btn-top), var(--ls-btn-bottom)); color: var(--ls-btn-ink); }
html[data-site="ls"] .lsx-tab[aria-selected="true"] span { background: rgba(0, 0, 0, .18); }
html[data-site="ls"] .lsx-title { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 14px; margin: 0 0 12px; }
html[data-site="ls"] .lsx-title h2 { margin: 0; font-size: 32px; font-weight: 900; line-height: 1; letter-spacing: -.5px; color: var(--ls-text); }
html[data-site="ls"] .lsx-title p { margin: 0; color: var(--ls-muted); font-size: 13.5px; }
html[data-site="ls"] .lsx-title h2 em { font-style: normal; }
html[data-site="ls"] .lsx-title h2 em.is-m { color: var(--lsx-cyan); text-shadow: 0 0 18px rgba(56, 189, 248, .4); }
html[data-site="ls"] .lsx-title h2 em.is-f { color: var(--lsx-pink); text-shadow: 0 0 18px rgba(255, 61, 154, .4); }
html[data-site="ls"] .lsx-gender { display: inline-flex; align-items: center; gap: 4px; padding: 4px; border-radius: 999px; background: var(--ls-field); border: 1px solid var(--ls-line); align-self: center; }
html[data-site="ls"] .lsx-gender-hint { display: inline-flex; align-items: center; gap: 5px; padding: 0 8px 0 10px; color: var(--ls-muted); font-size: 12.5px; font-weight: 800; }
html[data-site="ls"] .lsx-gender-hint svg { width: 16px; height: 16px; }
html[data-site="ls"] .lsx-gender button { display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 16px 0 5px; border: 0; border-radius: 999px; background: transparent; color: var(--ls-text); cursor: pointer; font: 800 14.5px var(--ls-font); transition: background .15s ease, color .15s ease; }
html[data-site="ls"] .lsx-gender button img { width: 28px; height: 28px; border-radius: 50%; object-fit: cover; object-position: 50% 20%; }
html[data-site="ls"] .lsx-gender button:hover { background: color-mix(in srgb, var(--ls-text) 8%, transparent); }
html[data-site="ls"] .lsx-gender button[aria-pressed="false"] img { filter: grayscale(.6); opacity: .75; }
html[data-site="ls"] .lsx-gender .is-m[aria-pressed="true"] { background: linear-gradient(135deg, #38bdf8, #2563eb); color: #ffffff; box-shadow: 0 4px 14px rgba(37, 99, 235, .35); }
html[data-site="ls"] .lsx-gender .is-f[aria-pressed="true"] { background: linear-gradient(135deg, #ff3d9a, #8b5cf6); color: #ffffff; box-shadow: 0 4px 14px rgba(255, 61, 154, .35); }
html[data-site="ls"] .lsx-univs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 7px; }
@container (min-width: 1000px) { html[data-site="ls"] .lsx-univs { grid-template-columns: repeat(8, minmax(0, 1fr)); } }
@container (max-width: 520px) { html[data-site="ls"] .lsx-univs { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
html[data-site="ls"] .lsx-univ { display: flex; flex-direction: column; overflow: hidden; border-radius: 10px; background: var(--ls-card); border: 1px solid var(--ls-card-edge, var(--ls-line)); }
html[data-site="ls"] .lsx-univ-head { padding: 7px 4px; background: var(--u); color: #f6eefc; text-align: center; font-size: 13px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html[data-site="ls"] .lsx-univ-state { display: flex; align-items: center; justify-content: center; gap: 4px; min-height: 22px; padding: 6px 4px 0; font-size: 11px; font-weight: 800; color: color-mix(in srgb, #d97706 70%, var(--ls-text)); }
html[data-site="ls"] .lsx-univ-state.is-open { color: color-mix(in srgb, #10b981 75%, var(--ls-text)); }
html[data-site="ls"] .lsx-univ-state svg { width: 11px; height: 11px; }
html[data-site="ls"] .lsx-pick { position: relative; display: block; width: 100%; margin: 4px 0 0; padding: 0; border: 0; background: none; cursor: pointer; color: var(--ls-text); font: inherit; }
html[data-site="ls"] .lsx-pick-art { position: relative; display: block; margin: 0 5px; aspect-ratio: 157 / 152; overflow: hidden; border-radius: 48% 48% 9px 9px / 34% 34% 9px 9px; background: #0b0e20; transition: transform .18s ease, box-shadow .18s ease; }
html[data-site="ls"] .lsx-univ.is-classic .lsx-pick-art, html[data-site="ls"] .lsx-univ.is-retro .lsx-pick-art { border-radius: 9px; }
html[data-site="ls"] .lsx-pick-art img { display: block; width: 100%; height: 100%; object-fit: cover; }
html[data-site="ls"] .lsx-pick-label { display: block; padding: 3px 0 7px; text-align: center; font-size: 13px; font-weight: 600; }
html[data-site="ls"] .lsx-pick:hover .lsx-pick-art { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0, 0, 0, .35); }
html[data-site="ls"] .lsx-pick.is-on .lsx-pick-art { box-shadow: 0 0 0 3px var(--lsx-sel), 0 0 20px color-mix(in srgb, var(--lsx-sel) 55%, transparent); }
html[data-site="ls"] .lsx-pick.is-on::after { content: "✓"; position: absolute; top: 6px; right: 10px; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--lsx-sel); color: #ffffff; font-size: 13px; font-weight: 900; box-shadow: 0 2px 8px rgba(0, 0, 0, .4); }
html[data-site="ls"] .is-locked .lsx-pick-art img, html[data-site="ls"] .lsx-round.is-locked img, html[data-site="ls"] .lsx-tile.is-locked .lsx-tile-ico img { filter: grayscale(.85) brightness(.55); }
html[data-site="ls"] .lsx-lock { position: absolute; left: 50%; bottom: 8px; transform: translateX(-50%); display: inline-flex; align-items: center; gap: 4px; max-width: 94%; padding: 3px 8px; border-radius: 999px; background: rgba(8, 10, 24, .84); border: 1px solid rgba(251, 191, 36, .55); color: var(--lsx-gold); font-size: 10.5px; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html[data-site="ls"] .lsx-lock svg { width: 11px; height: 11px; flex: none; }
html[data-site="ls"] .lsx-shelf { padding: 14px 16px 16px; border-radius: 14px; background: var(--ls-card); border: 1px solid var(--ls-card-edge, var(--ls-line)); }
html[data-site="ls"] .lsx-shelf + .lsx-shelf { margin-top: 12px; }
html[data-site="ls"] .lsx-shelf h3 { margin: 0 0 12px; font-size: 21px; font-weight: 900; color: var(--lsx-pink); }
html[data-site="ls"] .lsx-shelf h3 small { margin-left: 6px; color: var(--ls-text); font-size: 13px; font-weight: 600; }
html[data-site="ls"] .lsx-rounds { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px 10px; }
@container (min-width: 1000px) { html[data-site="ls"] .lsx-rounds { grid-template-columns: repeat(9, minmax(0, 1fr)); } }
@container (max-width: 520px) { html[data-site="ls"] .lsx-rounds { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
html[data-site="ls"] .lsx-round { position: relative; display: flex; flex-direction: column; align-items: center; gap: 7px; padding: 0; border: 0; background: none; cursor: pointer; color: var(--ls-text); font: 600 12.5px var(--ls-font); text-align: center; }
html[data-site="ls"] .lsx-round-art { position: relative; width: 100%; max-width: 104px; aspect-ratio: 1; overflow: hidden; border-radius: 50%; transition: transform .18s ease, box-shadow .18s ease; }
html[data-site="ls"] .lsx-round-art img { display: block; width: 100%; height: 100%; object-fit: cover; }
html[data-site="ls"] .lsx-round-art > span { position: absolute; inset: 0; border-radius: 50%; }
html[data-site="ls"] .lsx-round:hover .lsx-round-art { transform: scale(1.05); }
html[data-site="ls"] .lsx-round.is-on .lsx-round-art { box-shadow: 0 0 0 3px var(--ls-card), 0 0 0 6px var(--lsx-sel), 0 0 24px color-mix(in srgb, var(--lsx-sel) 50%, transparent); }
html[data-site="ls"] .lsx-round .lsx-lock { top: 50%; bottom: auto; transform: translate(-50%, -50%); }
html[data-site="ls"] .lsx-swatches { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--ls-line); color: var(--ls-muted); font-size: 12.5px; font-weight: 700; }
html[data-site="ls"] .lsx-sw { width: 28px; height: 28px; padding: 0; border-radius: 50%; border: 2px solid transparent; cursor: pointer; }
html[data-site="ls"] .lsx-sw[aria-pressed="true"] { border-color: var(--ls-text); box-shadow: 0 0 0 2px var(--ls-card), 0 0 10px color-mix(in srgb, var(--ls-text) 40%, transparent); }
html[data-site="ls"] .lsx-hint { margin: 10px 0 0; color: var(--ls-muted); font-size: 12.5px; }
html[data-site="ls"] .lsx-slots { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 14px; }
html[data-site="ls"] .lsx-slot-btn { display: flex; align-items: center; gap: 8px; padding: 6px 12px 6px 6px; border-radius: 12px; border: 1px solid var(--ls-line); background: var(--ls-field); color: var(--ls-text); cursor: pointer; font: 700 13px var(--ls-font); }
html[data-site="ls"] .lsx-slot-btn[aria-pressed="true"] { border-color: var(--lsx-sel); box-shadow: 0 0 0 1px var(--lsx-sel); }
html[data-site="ls"] .lsx-slot-btn .lsx-thumb { width: 34px; height: 34px; }
html[data-site="ls"] .lsx-slot-btn em { font-style: normal; color: color-mix(in srgb, #d97706 70%, var(--ls-text)); font-size: 11.5px; font-weight: 800; }
html[data-site="ls"] .lsx-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(86px, 1fr)); gap: 12px 10px; }
html[data-site="ls"] .lsx-tile { position: relative; display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 0; border: 0; background: none; cursor: pointer; color: var(--ls-text); font: 600 12px var(--ls-font); text-align: center; }
html[data-site="ls"] .lsx-tile-ico { position: relative; display: grid; place-items: center; width: 70px; height: 70px; border-radius: 14px; background: linear-gradient(180deg, #1a2046, #121633); border: 1px solid var(--ls-line); transition: transform .18s ease, box-shadow .18s ease; }
html[data-site="ls"] .lsx-tile-ico img { width: 72%; height: 72%; object-fit: contain; }
html[data-site="ls"] .lsx-tile:hover .lsx-tile-ico { transform: translateY(-2px); }
html[data-site="ls"] .lsx-tile.is-on .lsx-tile-ico { border-color: var(--lsx-sel); box-shadow: 0 0 0 2px var(--lsx-sel), 0 0 16px color-mix(in srgb, var(--lsx-sel) 45%, transparent); }
html[data-site="ls"] .lsx-tile .lsx-lock { top: 47px; bottom: auto; padding: 2px 6px; font-size: 10px; }
html[data-site="ls"] .lsx-slotno { position: absolute; top: -6px; right: -6px; display: grid; place-items: center; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 10px; background: var(--lsx-sel); color: #ffffff; font-size: 11px; font-weight: 900; }
html[data-site="ls"] .lsx-bonuses { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px; }
html[data-site="ls"] .lsx-bonus { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 16px 12px 14px; border-radius: 14px; border: 1px solid var(--ls-line); background: radial-gradient(circle at 50% 32%, rgba(139, 92, 246, .22), transparent 62%), linear-gradient(180deg, #1a1d45, #111430); color: #f3f4fc; cursor: pointer; text-align: center; font: inherit; }
html[data-site="ls"] .lsx-bonus:hover { border-color: var(--lsx-sel); }
html[data-site="ls"] .lsx-bonus.is-on { border-color: var(--lsx-sel); box-shadow: 0 0 0 1px var(--lsx-sel), 0 0 22px color-mix(in srgb, var(--lsx-sel) 30%, transparent); }
html[data-site="ls"] .lsx-bonus b { font-size: 14.5px; font-weight: 800; }
html[data-site="ls"] .lsx-bonus small { color: #a3a9cc; font-size: 12px; line-height: 1.35; }
html[data-site="ls"] .lsx-bonus .lsx-req { display: inline-flex; align-items: center; gap: 4px; color: #34d399; font-size: 11.5px; font-weight: 800; }
html[data-site="ls"] .lsx-bonus.is-locked .lsx-req { color: var(--lsx-gold); }
html[data-site="ls"] .lsx-bonus .lsx-req svg { width: 11px; height: 11px; }
html[data-site="ls"] .lsx-bonus.is-locked .lsx-av { filter: saturate(.5) brightness(.8); }
html[data-site="ls"] .lsx-bonus-av { display: block; padding: 14px; }
html[data-site="ls"] .lsx-av { --s: 240px; --fx: #ff3d9a; display: block; position: relative; flex: none; width: var(--s); height: var(--s); }
html[data-site="ls"] .lsx-av-disc { position: absolute; inset: 0; z-index: 2; overflow: hidden; border-radius: 50%; background: var(--disc, #0b0e20); }
html[data-site="ls"] .lsx-av-disc::after { content: ""; position: absolute; inset: 0; z-index: 3; border-radius: 50%; box-shadow: inset 0 0 0 calc(var(--s) * .014) rgba(255, 255, 255, .14); pointer-events: none; }
html[data-site="ls"] .lsx-av-bg { position: absolute; inset: -3%; width: 106%; height: 106%; max-width: none; object-fit: cover; }
html[data-site="ls"] .lsx-av-scene { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; transform: scale(1.06); }
html[data-site="ls"] .lsx-av-char, html[data-site="ls"] .lsx-av-pop { position: absolute; left: 50%; bottom: -3%; width: 104%; max-width: none; transform: translateX(-50%); }
html[data-site="ls"] .lsx-av.is-pop .lsx-av-char, html[data-site="ls"] .lsx-av.is-pop .lsx-av-pop { width: 118%; bottom: -4%; }
html[data-site="ls"] .lsx-av-pop { z-index: 4; clip-path: inset(0 0 52% 0); }
html[data-site="ls"] .lsx-av-neon { box-shadow: inset 0 0 0 calc(var(--s) * .035) var(--neon, #ff3d9a), inset 0 0 calc(var(--s) * .12) var(--neon, #ff3d9a); }
html[data-site="ls"] .lsx-av-pin { position: absolute; z-index: 6; right: -4%; bottom: -1%; display: grid; place-items: center; width: 31%; height: 31%; border-radius: 50%; background: radial-gradient(circle at 32% 26%, #2c3370, #121634 70%); border: calc(var(--s) * .014) solid var(--fx); box-shadow: 0 calc(var(--s) * .015) calc(var(--s) * .05) rgba(0, 0, 0, .55); }
html[data-site="ls"] .lsx-av-pin img { width: 68%; height: 68%; object-fit: contain; }
html[data-site="ls"] .lsx-av-pin.is-left { right: auto; left: -4%; }
html[data-site="ls"] .lsx-av-fx { position: absolute; inset: 0; z-index: 1; border-radius: 50%; pointer-events: none; }
html[data-site="ls"] .lsx-av-top { position: absolute; inset: 0; z-index: 5; pointer-events: none; }
html[data-site="ls"] .lsx-fx-halo .lsx-av-fx { inset: -7%; background: radial-gradient(circle, color-mix(in srgb, var(--fx) 70%, transparent) 55%, transparent 71%); filter: blur(calc(var(--s) * .03)); animation: ls-fx-breathe 2.6s ease-in-out infinite; }
html[data-site="ls"] .lsx-fx-halo .lsx-av-top { inset: -2.5%; z-index: 1; border-radius: 50%; border: calc(var(--s) * .012) solid color-mix(in srgb, var(--fx) 85%, #ffffff); box-shadow: 0 0 calc(var(--s) * .05) var(--fx), inset 0 0 calc(var(--s) * .04) var(--fx); }
html[data-site="ls"] .lsx-fx-ring .lsx-av-fx { inset: -6.5%; background: conic-gradient(from 0deg, var(--fx), #8b5cf6, #38bdf8, #34d399, #fbbf24, var(--fx)); -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - var(--s) * .05), #000 calc(100% - var(--s) * .045)); mask: radial-gradient(farthest-side, transparent calc(100% - var(--s) * .05), #000 calc(100% - var(--s) * .045)); filter: drop-shadow(0 0 calc(var(--s) * .03) var(--fx)); animation: ls-fx-spin 5s linear infinite; }
html[data-site="ls"] .lsx-fx-ring .lsx-av-top { inset: -6.5%; z-index: 1; border-radius: 50%; background: conic-gradient(from 0deg, transparent 0 70%, rgba(255, 255, 255, .9) 78%, transparent 86%); -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - var(--s) * .05), #000 calc(100% - var(--s) * .045)); mask: radial-gradient(farthest-side, transparent calc(100% - var(--s) * .05), #000 calc(100% - var(--s) * .045)); animation: ls-fx-spin 2.2s linear infinite; }
html[data-site="ls"] .lsx-fx-aura .lsx-av-fx, html[data-site="ls"] .lsx-fx-aura .lsx-av-top { z-index: 1; border-radius: 50%; border: calc(var(--s) * .012) solid var(--fx); box-shadow: 0 0 calc(var(--s) * .04) var(--fx); animation: ls-fx-ripple 2.4s ease-out infinite; }
html[data-site="ls"] .lsx-fx-aura .lsx-av-top { animation-delay: 1.2s; }
html[data-site="ls"] .lsx-fx-sparkle .lsx-av-fx { inset: -5%; background: radial-gradient(circle, color-mix(in srgb, var(--fx) 45%, transparent) 50%, transparent 70%); filter: blur(calc(var(--s) * .025)); }
html[data-site="ls"] .lsx-fx-sparkle .lsx-av-top { inset: -14%; z-index: 7; animation: ls-fx-spin 14s linear infinite; }
html[data-site="ls"] .lsx-fx-sparkle .lsx-av-top i { position: absolute; width: calc(var(--s) * .075); height: calc(var(--s) * .075); background: #ffffff; clip-path: polygon(50% 0, 61% 39%, 100% 50%, 61% 61%, 50% 100%, 39% 61%, 0 50%, 39% 39%); filter: drop-shadow(0 0 calc(var(--s) * .02) var(--fx)); animation: lsx-twinkle 1.8s ease-in-out infinite; }
html[data-site="ls"] .lsx-fx-sparkle .lsx-av-top i:nth-child(1) { left: 8%; top: 18%; }
html[data-site="ls"] .lsx-fx-sparkle .lsx-av-top i:nth-child(2) { left: 84%; top: 10%; width: calc(var(--s) * .05); height: calc(var(--s) * .05); animation-delay: .4s; }
html[data-site="ls"] .lsx-fx-sparkle .lsx-av-top i:nth-child(3) { left: 92%; top: 56%; animation-delay: .9s; }
html[data-site="ls"] .lsx-fx-sparkle .lsx-av-top i:nth-child(4) { left: 3%; top: 64%; width: calc(var(--s) * .05); height: calc(var(--s) * .05); animation-delay: 1.3s; }
html[data-site="ls"] .lsx-fx-sparkle .lsx-av-top i:nth-child(5) { left: 46%; top: 0; width: calc(var(--s) * .045); height: calc(var(--s) * .045); animation-delay: .7s; }
html[data-site="ls"] .lsx-fx-sparkle .lsx-av-top i:nth-child(6) { left: 60%; top: 92%; width: calc(var(--s) * .055); height: calc(var(--s) * .055); animation-delay: 1.1s; }
html[data-site="ls"] .lsx-fx-flame .lsx-av-fx { inset: -12%; background: conic-gradient(from 0deg, #ff6a00, #ffd23f, #ff2d55, #ff6a00, #ffb800, #ff2d55, #ff6a00); -webkit-mask: radial-gradient(farthest-side, transparent 66%, #000 74%, transparent 100%); mask: radial-gradient(farthest-side, transparent 66%, #000 74%, transparent 100%); filter: blur(calc(var(--s) * .028)); animation: ls-fx-spin 3.2s linear infinite, ls-fx-flicker .9s ease-in-out infinite alternate; }
html[data-site="ls"] .lsx-fx-flame .lsx-av-top { inset: -4%; z-index: 1; border-radius: 50%; border: calc(var(--s) * .01) solid #ffb547; box-shadow: 0 0 calc(var(--s) * .06) #ff6a00, inset 0 0 calc(var(--s) * .04) #ff6a00; }
@keyframes lsx-twinkle { 0%, 100% { transform: scale(.4) rotate(0); opacity: .3; } 50% { transform: scale(1.1) rotate(45deg); opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
	html[data-site="ls"] .lsx-av-fx, html[data-site="ls"] .lsx-av-top, html[data-site="ls"] .lsx-av-top i { animation: none; }
}
@media (max-width: 1100px) {
	html[data-site="ls"] .lsx-hero { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 560px) {
	html[data-site="ls"] .lsx-compo, html[data-site="ls"] .lsx-coll { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	html[data-site="ls"] .lsx-title h2 { font-size: 26px; }
	html[data-site="ls"] .lsx-btn { flex: 1; }
	html[data-site="ls"] .lsx-stage-av > .ls-avatar { width: 200px; height: 200px; }
}
@media (max-width: 900px) {
	html[data-site="ls"] .lsp-head { grid-template-columns: auto minmax(0, 1fr); }
	html[data-site="ls"] .lsp-xp { grid-column: 1 / -1; }
	html[data-site="ls"] .lsp-cols { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 520px) {
	html[data-site="ls"] .lsp-badges { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	html[data-site="ls"] .lsp-save { width: 100%; margin-left: 0; }
}
