.ps-detail-trigger{font:inherit;color:inherit;background:none;border:0;padding:0;text-align:left;text-decoration:none;cursor:pointer}
.ps-detail-dialog{box-sizing:border-box;width:min(620px,calc(100% - 24px));max-height:88dvh;margin:auto;padding:24px;color:#edf4e8;background:#071b10;border:1px solid #69863b;border-radius:18px;box-shadow:0 20px 80px #000b;overflow:auto;font:inherit}
.ps-detail-dialog::backdrop{background:#000b;backdrop-filter:blur(4px)}
.ps-detail-dialog h2{font-size:24px;margin:0 40px 20px;text-align:center}.ps-detail-dialog h3{font-size:15px;margin:0 0 8px;color:#cbd7de}.ps-detail-dialog p{font-size:15px;line-height:1.65;margin:0}.ps-detail-level{padding:16px;border:1px solid #3e5647;border-radius:10px;margin-bottom:10px}.ps-detail-level.level-2{border-color:#8d782e}.ps-detail-level.level-2 h3{color:#edcd59}.ps-detail-level.level-3{border-color:#6f63c4}.ps-detail-level.level-3 h3{color:#c9c2ff}.ps-detail-close{position:absolute;right:12px;top:10px;width:36px;height:36px;border:1px solid #596953;border-radius:50%;background:#142b1c;color:white;font-size:26px;cursor:pointer}.ps-detail-dialog figure{margin:18px 0}.ps-detail-dialog img{display:block;width:100%;height:auto;border-radius:8px}.ps-detail-dialog figcaption,.ps-detail-dialog .ps-detail-note{font-size:12px;color:#a6bba9;margin:10px 0}.ps-detail-dialog a{color:#abd976;font-size:13px}
.player-series-line #playerSeriesBadge{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px;cursor:pointer}.series-search-icon{width:17px;height:17px;display:inline-block;margin-left:7px;vertical-align:middle;stroke:currentColor;fill:none;stroke-width:2}
.ps-database .ps-levels{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));grid-column:1/-1;width:100%;gap:8px}.ps-database .ps-level{display:flex;justify-content:center;align-items:center;min-height:28px;padding:3px 12px;line-height:20px;box-sizing:border-box;width:100%}

.ps-detail-trigger::after{content:"i";display:inline-flex;align-items:center;justify-content:center;width:15px;height:15px;margin-left:7px;border:1px solid #8dba65;border-radius:50%;color:#a9d97c;font:600 11px/1 sans-serif;vertical-align:middle}

/* Compact detail surface, using the PCB dialog palette. */
.ps-detail-dialog{width:min(500px,calc(100% - 24px));padding:18px;border-color:rgba(232,188,54,.58);background:radial-gradient(circle at 7% 0,rgba(242,198,65,.18),transparent 30%),radial-gradient(circle at 23% 8%,rgba(137,232,95,.11),transparent 34%),linear-gradient(155deg,#062014,#020f09 72%);box-shadow:0 24px 80px #000b,inset 0 1px rgba(255,238,176,.08)}
.ps-detail-dialog h2{font-size:21px;line-height:1.3;margin:0 36px 14px;text-align:center}
.ps-detail-dialog .ps-detail-level{margin:0 0 8px;padding:11px 12px;background:linear-gradient(120deg,#becbd408,transparent)}
.ps-detail-dialog .ps-detail-level.level-2{background:linear-gradient(120deg,#dabb4420,#12291660)}
.ps-detail-dialog .ps-detail-level.level-3{background:linear-gradient(120deg,#a69cf526,#12291660)}
.ps-detail-dialog h3{display:flex;align-items:center;gap:8px;margin:0 0 6px;font-size:14px;line-height:1.3}
.ps-detail-dialog img.ps-detail-level-icon{width:25px;height:25px;object-fit:contain;border-radius:0;flex-shrink:0}
.ps-detail-dialog .level-1 .ps-detail-level-icon:not([src*="-silver.svg"]){filter:grayscale(1) brightness(1.15)}
/* New playstyles ship a ready-made silver SVG; extra greying/brightening washes it out. */
.ps-detail-dialog .level-1 .ps-detail-level-icon[src*="-silver.svg"]{filter:contrast(1.12) drop-shadow(0 1px 1px rgba(0,0,0,.5))}
.ps-detail-dialog p{font-size:13px;line-height:1.55}
.ps-detail-dialog figure{margin:12px 0 8px}
.ps-detail-dialog figcaption,.ps-detail-dialog .ps-detail-note{font-size:11px;margin:6px 0}
.ps-detail-dialog a{font-size:12px}
.ps-detail-dialog .ps-detail-close{width:30px;height:30px;font-size:22px;right:10px;top:10px}

.player-series-line #playerSeriesBadge{display:inline-flex;align-items:center;justify-content:center;gap:5px;max-width:100%;font-size:clamp(12px,3.2vw,22px);white-space:nowrap}
.player-series-line #playerSeriesBadge .series-search-icon{display:block;flex:0 0 14px;width:14px;height:14px;margin:0}

.ps-database .ps-level{font-weight:700}

/* Library row badge cycles Lv.1 silver -> Lv.2 gold -> Lv.3 purple (TeeO 2026-10-20) */
.ps-database .ps-symbol.ps-cycle{position:relative}
.ps-database .ps-symbol.ps-cycle img{position:absolute;inset:0;margin:auto;opacity:0;animation:ps-cycle 7.5s infinite}
.ps-database .ps-symbol.ps-cycle img:nth-child(2){animation-delay:2.5s}
.ps-database .ps-symbol.ps-cycle img:nth-child(3){animation-delay:5s}
.ps-database .ps-symbol.ps-cycle img.ps-cycle-silver:not([src*="-silver.svg"]){filter:grayscale(1) saturate(0) brightness(1.24) contrast(.88)}
@keyframes ps-cycle{0%{opacity:0}6%{opacity:1}33%{opacity:1}40%{opacity:0}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){.ps-database .ps-symbol.ps-cycle img{animation:none}.ps-database .ps-symbol.ps-cycle img:nth-child(2){opacity:1}}
.ps-database .ps-level-3.is-empty{opacity:.55;cursor:default}
.ps-database .ps-level-3.is-empty:hover,.ps-database .ps-level-3.is-empty:focus-visible{filter:none}
button.ps-symbol{padding:0;border:0;background:none;font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
button.ps-symbol:focus-visible{outline:2px solid #a9d97c;outline-offset:3px;border-radius:8px}
/* Glint sweeps across the badge just before each colour change (TeeO 2026-10-20) */
.ps-database .ps-symbol.ps-cycle .ps-glint{position:absolute;inset:0;margin:auto;width:30px;height:30px;pointer-events:none;-webkit-mask:var(--ps-mask) center/contain no-repeat;mask:var(--ps-mask) center/contain no-repeat;background:linear-gradient(110deg,transparent 38%,rgba(255,255,255,.18) 44%,rgba(255,255,255,.92) 50%,rgba(255,255,255,.18) 56%,transparent 62%) no-repeat;background-size:300% 100%;background-position:130% 0;animation:ps-glint 2.5s infinite}
@media(max-width:700px){.ps-database .ps-symbol.ps-cycle .ps-glint{width:27px;height:27px}}
@keyframes ps-glint{0%,62%{background-position:130% 0}96%,100%{background-position:-30% 0}}
@media (prefers-reduced-motion:reduce){.ps-database .ps-symbol.ps-cycle .ps-glint{display:none}}
/* Library rows: 'ข้อมูล' capsule replaces the (i); level buttons read 'ดูนักเตะ Lv.x' so they are not mistaken for level info (TeeO 2026-10-20) */
.ps-database .ps-row .ps-detail-trigger::after{content:none}
.ps-database .ps-info-pill{display:inline-flex;align-items:center;height:16px;margin-left:6px;padding:0 6px;border:1px solid rgba(141,186,101,.45);border-radius:999px;background:none;color:#8fae78;font-family:inherit;font-size:9.5px;font-weight:500;line-height:1;letter-spacing:.02em;vertical-align:middle;cursor:pointer;white-space:nowrap;position:relative}.ps-database .ps-info-pill::before{content:'';position:absolute;inset:-12px -8px}
.ps-database .ps-info-pill:hover,.ps-database .ps-info-pill:focus-visible{color:#a9d97c;border-color:#8dba65}
.ps-database .ps-level .ps-level-label{display:inline!important;white-space:nowrap}
.ps-database .ps-row h4 .ps-info-pill{margin-right:auto}.ps-database .ps-row h4 .ps-player-count{margin-left:auto}