main.content:has(#CharFinder.is-active){background:#0d1320}
#charfinder-root{--cf-panel:#151b27;--cf-line:#2c374b;--cf-muted:#a2afc4;--cf-accent:#a4bcff;background:#0d1320;color:#eaf0fb;font:14px/1.6 system-ui,sans-serif;max-width:1500px;margin:auto;padding:20px 8px}
#charfinder-root *{box-sizing:border-box}
#charfinder-root h2,#charfinder-root h3,#charfinder-root p{margin:0 0 12px}
#charfinder-root h2{font-size:26px;letter-spacing:.03em}
#charfinder-root h3{font-size:17px}
#charfinder-root button,#charfinder-root input,#charfinder-root select,#charfinder-root textarea{font:inherit;border:1px solid var(--cf-line);border-radius:9px;background:#101620;color:inherit;padding:9px 12px;min-width:0;max-width:100%;margin:0}
#charfinder-root button{cursor:pointer;font-weight:600;white-space:normal}
#charfinder-root button:hover{border-color:var(--cf-accent);background:#24314d}
#charfinder-root button:focus-visible,#charfinder-root input:focus-visible,#charfinder-root select:focus-visible,#charfinder-root textarea:focus-visible{outline:2px solid var(--cf-accent);outline-offset:2px}
#charfinder-root button:disabled{opacity:.45;cursor:default}
#charfinder-root .cf-primary{background:#b7caff;color:#101b33;border-color:#b7caff}
#charfinder-root .cf-muted,#charfinder-root small{color:var(--cf-muted)}
#charfinder-root .cf-head,#charfinder-root .cf-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px}
#charfinder-root .cf-head>div:first-child{flex:1}
#charfinder-root .cf-panel{background:var(--cf-panel);border:1px solid var(--cf-line);border-radius:14px;padding:18px;margin-bottom:16px}
#charfinder-root .cf-filters{display:grid;grid-template-columns:2fr 1fr;gap:12px;margin-bottom:14px}
#charfinder-root .cf-owner-filter{border:0;padding:0;margin:0 0 20px;min-width:0}
#charfinder-root .cf-owner-filter legend{font-size:12px;color:var(--cf-muted);margin-bottom:8px;padding:0}
#charfinder-root .cf-owner-filter legend small{margin-left:10px}
#charfinder-root .cf-owner-options{display:flex;gap:8px;flex-wrap:wrap}
#charfinder-root button.cf-owner-choice{display:inline-flex;gap:8px;align-items:center;border-radius:99px;padding:7px 12px;color:var(--cf-owner-color,#d4dded);border-color:rgba(var(--cf-owner-rgb,170,184,210),.3)}
#charfinder-root button.cf-owner-choice:hover{background:rgba(var(--cf-owner-rgb,170,184,210),.08);border-color:var(--cf-owner-color,#d4dded)}
#charfinder-root button.cf-owner-choice[aria-pressed=true]{background:rgba(var(--cf-owner-rgb,170,184,210),.15);border-color:var(--cf-owner-color,#d4dded)}
#charfinder-root .cf-owner-dot{width:8px;height:8px;border-radius:50%;background:var(--cf-owner-color,#d4dded);flex-shrink:0}
#charfinder-root .cf-owner-tick{visibility:hidden;font-size:12px}
#charfinder-root [aria-pressed=true]>.cf-owner-tick{visibility:visible}
#charfinder-root .cf-owner-tag{color:var(--cf-owner-color,#d4dded);font-weight:600}
#charfinder-root label{display:flex;flex-direction:column;gap:5px;font-size:12px;color:var(--cf-muted)}
#charfinder-root label input,#charfinder-root label select,#charfinder-root label textarea{font-size:14px;color:#eef2fb;width:100%}
#charfinder-root label.cf-check{flex-direction:row;align-items:center;color:#eaf0fb}
#charfinder-root .cf-check input{width:auto}
#charfinder-root .cf-condition{display:flex;gap:7px;align-items:center;flex-wrap:wrap;padding:8px 0;border-top:1px solid #222d40}
#charfinder-root .cf-combobox{position:relative;flex:1;min-width:150px}
#charfinder-root .cf-combobox:focus-within{z-index:20}
#charfinder-root .cf-condition .cf-combobox input{width:100%;padding-right:42px;min-width:0}
#charfinder-root button.cf-combo-toggle{position:absolute;right:1px;top:1px;bottom:1px;width:38px;padding:0;border:0;border-left:1px solid var(--cf-line);border-radius:0 8px 8px 0;color:var(--cf-accent)}
#charfinder-root .cf-combo-popup{position:absolute;z-index:30;left:0;right:0;top:calc(100% + 6px);overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;background:#1b2535;border:1px solid #6a819f;border-radius:10px;box-shadow:0 12px 30px #0009;padding:5px}
#charfinder-root .cf-combo-popup[data-side=up]{top:auto;bottom:calc(100% + 6px)}
#charfinder-root .cf-combo-option{padding:8px 10px;cursor:pointer;border-radius:6px;overflow-wrap:anywhere}
#charfinder-root .cf-combo-option:hover,#charfinder-root .cf-combo-option[aria-selected=true]{background:#34486c;color:#fff}
#charfinder-root .cf-combo-note{font-size:12px;color:var(--cf-muted);padding:8px 10px;margin:0;overflow-wrap:anywhere}
#charfinder-root button.cf-combo-more{width:100%;font-size:12px;padding:6px 10px}
#charfinder-root .cf-condition [data-field=value],#charfinder-root .cf-condition [data-field=matchValue]{width:80px}
#charfinder-root .cf-condition [data-field=kind]{width:125px}
#charfinder-root .cf-remove{color:#ffb8bf;padding:6px 10px}
#charfinder-root details>summary{cursor:pointer;color:var(--cf-accent);padding:5px 0}
#charfinder-root .cf-or{border-left:3px solid #a18bc9;margin:12px 0;padding:6px 12px;background:#191d2d;border-radius:6px}
#charfinder-root .cf-expression{font-size:13px;color:#c0cef3;padding-top:12px;overflow-wrap:anywhere}
#charfinder-root .cf-results-section{padding:10px;background:#141a24}
#charfinder-root .cf-results-hint{margin:2px 0 12px;font-size:12px;color:#8693a6}
#charfinder-root .cf-results{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(255px,100%),1fr));gap:10px}
#charfinder-root .cf-results>.cf-empty{grid-column:1/-1}
#charfinder-root button.cf-card{display:flex;gap:10px;align-items:flex-start;min-width:0;width:100%;min-height:82px;padding:10px;border:1px solid rgba(var(--cf-owner-rgb,170,184,210),.28);border-left:4px solid var(--cf-owner-color,#aab8d2);border-radius:14px;background:rgba(var(--cf-owner-rgb,170,184,210),.055);text-align:left;font-weight:400;transition:background .14s ease,border-color .14s ease}
#charfinder-root button.cf-card:hover,#charfinder-root button.cf-card[data-selected=true]{border-color:var(--cf-owner-color,#aab8d2);background:rgba(var(--cf-owner-rgb,170,184,210),.11)}
#charfinder-root .cf-card .cf-avatar{width:52px;height:52px;flex:0 0 52px;border-radius:13px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.04)}
#charfinder-root .cf-card-info{min-width:0}
#charfinder-root .cf-card-name{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;font-size:14px;font-weight:700;line-height:1.35;overflow-wrap:anywhere;color:#eaf0fb}
#charfinder-root .cf-card-meta{display:block;margin-top:4px;font-size:11px;line-height:1.35;overflow-wrap:anywhere;color:#8693a6}
#charfinder-root button.cf-card.cf-lost{border-color:rgba(239,68,68,.42);border-left-color:#ef4444;background:rgba(239,68,68,.10)}
#charfinder-root button.cf-card.cf-lost:hover,#charfinder-root button.cf-card.cf-lost[data-selected=true]{border-color:rgba(239,68,68,.7);border-left-color:#ef4444;background:rgba(239,68,68,.16)}
#charfinder-root .cf-card.cf-lost .cf-card-name{color:#fecaca}
#charfinder-root .cf-card.cf-lost .cf-owner-tag{color:#fca5a5}
#charfinder-root .cf-avatar{width:48px;height:48px;object-fit:cover;border-radius:10px;background:#273551;flex-shrink:0;display:grid;place-items:center;font-size:20px}
#charfinder-root .cf-badge{font-size:11px;border:1px solid #3e506e;border-radius:5px;padding:2px 6px;white-space:nowrap}
#charfinder-root .cf-lost{color:#ffb8bf}
#charfinder-root .cf-empty{text-align:center;padding:50px 20px;color:var(--cf-muted);border:1px dashed var(--cf-line);border-radius:12px}
#charfinder-root .cf-detail{min-height:220px;min-width:0;padding:20px 24px 24px}
#charfinder-root .cf-detail .cf-avatar{width:64px;height:64px}
#charfinder-root .cf-tabs{display:flex;gap:6px;flex-wrap:wrap;border-bottom:1px solid var(--cf-line);padding-bottom:12px;margin:16px 0}
#charfinder-root .cf-tabs button[aria-selected=true]{background:#314267;border-color:#9ab7ff}
#charfinder-root .cf-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:14px 0}
#charfinder-root .cf-stat{background:#101620;border:1px solid var(--cf-line);padding:10px;border-radius:9px;text-align:center}
#charfinder-root .cf-stat b{display:block;font-size:21px}
#charfinder-root pre{font:13px/1.8 system-ui,sans-serif;white-space:pre-wrap;overflow-wrap:anywhere;max-height:65vh;overflow:auto;background:#101620;padding:14px;border-radius:10px;color:#dce5f5}
#charfinder-root .cf-table-wrap{overflow:auto;max-height:65vh}
#charfinder-root table{width:100%;border-collapse:collapse;font-size:13px;white-space:nowrap}
#charfinder-root th,#charfinder-root td{padding:8px 10px;border-bottom:1px solid var(--cf-line);text-align:right}
#charfinder-root tbody tr,#charfinder-root tbody tr:nth-child(even),#charfinder-root tbody td{background:#151b27;color:#eaf0fb}
#charfinder-root tbody tr:hover td{background:#202b40}
#charfinder-root th:first-child,#charfinder-root td:first-child{text-align:left}
#charfinder-root th{background:#1e283b;position:sticky;top:0}
#charfinder-root a{color:var(--cf-accent)}
#charfinder-root dialog{position:fixed;inset:0;margin:auto;color:#eaf0fb;background:#151b27;border:1px solid #50617c;border-radius:16px;padding:24px;width:min(650px,94vw);max-width:calc(100vw - 24px);max-height:90vh;overflow:auto}
#charfinder-root dialog.cf-detail-dialog{width:min(1100px,94vw);max-height:90dvh;padding:0;overscroll-behavior:contain}
#charfinder-root .cf-modal-head{display:flex;align-items:center;justify-content:space-between;gap:12px;position:sticky;top:0;z-index:2;background:#1c2638;border-bottom:1px solid var(--cf-line);padding:12px 20px}
#charfinder-root .cf-modal-head h3{margin:0}
html:has(#cf-detail-dialog[open]){overflow:hidden}
#charfinder-root dialog::backdrop{background:#030713c9}
#charfinder-root dialog form{display:grid;gap:14px}
#charfinder-root dialog textarea{min-height:150px;width:100%}
#charfinder-root [hidden]{display:none!important}
#charfinder-root .cf-message{min-height:24px;overflow-wrap:anywhere}
#charfinder-root .cf-error{color:#ffb7be}
#charfinder-root .cf-detail-body{overflow-wrap:anywhere}
@media(max-width:600px){#charfinder-root{padding:12px 0}#charfinder-root>.cf-head>div:first-child{flex-basis:100%}#charfinder-root>.cf-head>button{flex:1}#charfinder-root .cf-panel{padding:12px}#charfinder-root .cf-filters{grid-template-columns:1fr}#charfinder-root h2{font-size:22px}#charfinder-root .cf-condition [data-field=kind]{width:100px}#charfinder-root .cf-combobox{min-width:140px}#charfinder-root .cf-condition [data-field=value]{width:66px}#charfinder-root .cf-stats{grid-template-columns:repeat(4,minmax(0,1fr))}#charfinder-root .cf-detail{padding:16px 12px}#charfinder-root .cf-modal-head{padding:10px 12px}}
