.character-browser{min-width:0;margin-block:36px 48px;padding:clamp(16px,3vw,28px);border:1px solid var(--outline);border-radius:var(--r-md);background:var(--s1);color:var(--t1);overflow-wrap:anywhere}.character-browser .character-browser__header{display:grid;gap:12px}.character-browser .character-browser__eyebrow{color:var(--accent);font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.character-browser .character-browser__header h2{font-size:clamp(25px,3vw,32px)}.character-browser .character-browser__header>p:last-child{font-size:16px}.character-browser .character-browser__notice{margin-block:20px 12px;padding:14px 16px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--s2);color:var(--t2);font-size:14px}.character-browser .character-browser__notice strong{color:var(--t1)}.character-browser .character-browser__help{color:var(--t2);font-size:13px;line-height:1.6}.character-browser .character-browser__interactive{margin-top:24px}.character-browser .character-browser__search label{display:block;margin-bottom:5px;font-weight:800}.character-browser .character-browser__search-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}.character-browser .character-browser__search input{flex:1 1 240px;min-width:0;width:100%;min-height:48px;padding:10px 12px;border:1px solid var(--outline);border-radius:var(--r-sm);background:var(--bg);color:var(--t1);font:inherit;font-size:16px}.character-browser .character-browser__search input::placeholder{color:var(--t3);opacity:1}.character-browser .character-browser__search input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}.character-browser .character-browser__names{margin-top:16px;padding-inline:14px;border:1px solid var(--line);border-radius:var(--r-sm)}.character-browser .character-browser__names summary{min-height:44px;padding-block:12px;color:var(--accent);cursor:pointer;font-size:14px;font-weight:800}.character-browser .character-browser__names label{display:block;margin-top:8px;font-weight:800}.character-browser .character-browser__names select{display:block;width:100%;min-width:0;max-width:100%;height:18rem;margin-block:12px 16px;padding:6px;border:1px solid var(--outline);border-radius:6px;background:var(--bg);color:var(--t1);font:inherit;font-size:16px}.character-browser .character-browser__names option{padding:4px 8px}.character-browser .character-browser__names select:disabled{opacity:.7;cursor:wait}.character-browser .character-browser__filter{display:flex;align-items:center;gap:10px;min-height:44px;margin-top:12px;color:var(--t2);font-size:14px;cursor:pointer}.character-browser .character-browser__filter input{flex:none;width:20px;height:20px;accent-color:var(--accent)}.character-browser .character-browser__button{display:inline-flex;align-items:center;justify-content:center;min-width:0;min-height:44px;padding:10px 14px;border:1px solid var(--outline);border-radius:var(--r-sm);background:var(--s2);color:var(--t1);font:inherit;font-size:14px;font-weight:800;line-height:1.5;text-align:center;white-space:normal}.character-browser .character-browser__button--primary{background:linear-gradient(180deg,var(--brand-top),var(--brand));border-color:var(--brand);color:var(--on-brand)}.character-browser .character-browser__button:disabled{cursor:wait;opacity:.65}.character-browser .character-browser__browse{margin-top:12px}.character-browser .character-browser__status{margin-block:18px;color:var(--t2);font-size:14px}.character-browser .character-browser__error,.character-browser .character-browser__empty{margin-block:18px;padding:18px;border:1px solid var(--outline);border-radius:var(--r-sm);background:var(--s2);color:var(--t1)}.character-browser .character-browser__error p{margin-bottom:12px;color:var(--t1)}.character-browser .character-browser__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr));align-items:stretch;gap:20px;margin:0;padding:0;list-style:none}.character-browser .character-browser__item{min-width:0}.character-browser .character-browser__card{scroll-margin-block-start:calc(var(--header-h) + 16px);display:flex;flex-direction:column;height:100%;overflow:hidden;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--bg)}.character-browser .character-browser__media{display:flex;align-items:center;justify-content:center;aspect-ratio:307 / 460;border-bottom:1px solid var(--line);background:var(--s2)}.character-browser .character-browser__media--unavailable{aspect-ratio:auto;min-block-size:64px}.character-browser .character-browser__image{display:block;width:100%;height:100%;object-fit:contain}.character-browser .character-browser__unavailable{padding:24px;color:var(--t2);font-size:14px;text-align:center}.character-browser .character-browser__card-body{display:flex;flex-direction:column;gap:10px;min-width:0;padding:16px}.character-browser .character-browser__name{color:var(--t1);font-size:19px;line-height:1.3}.character-browser .character-browser__alias{color:var(--t2);font-size:14px}.character-browser .character-browser__tag-label{margin-top:4px;color:var(--t2);font-size:12px;font-weight:800}.character-browser .character-browser__tag{display:block;min-width:0;padding:10px;border:1px solid var(--line);border-radius:6px;background:var(--s1);color:var(--t1);font:13px/1.7 var(--mono);overflow-wrap:anywhere;white-space:pre-wrap;user-select:text}.character-browser .character-browser__copy{width:100%;color:var(--accent);background:var(--accent-bg)}.character-browser .character-browser__support{padding-top:4px;border-top:1px solid var(--line)}.character-browser .character-browser__support-title{min-height:44px;padding-block:10px;color:var(--t2);cursor:pointer;font-size:13px;font-weight:800}.character-browser .character-browser__support[open]>:not(summary){margin-top:10px}.character-browser .character-browser__more{display:flex;margin:24px auto 0}.character-browser .character-browser__attribution{display:grid;gap:10px;margin-top:24px;padding-top:18px;border-top:1px solid var(--line)}.character-browser .character-browser__attribution p{color:var(--t2);font-size:12px;line-height:1.8}.character-browser .character-browser__attribution a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}.character-browser :is(button,input,select,summary,a,h3):focus-visible{outline:3px solid var(--accent);outline-offset:3px}@media(hover:hover){.character-browser .character-browser__button:not(:disabled):hover{border-color:var(--accent);filter:brightness(1.08)}.character-browser .character-browser__attribution a:hover{text-decoration-thickness:2px}}@media(max-width:420px){.character-browser .character-browser__search-row>button{flex:1 1 auto}.character-browser .character-browser__browse{width:100%}}
