:root{color-scheme:dark;--bg:#002b36;--panel:#073642;--text:#93a1a1;--muted:#839496;--line:#28505a;--cyan:#2aa198;--yellow:#b58900;--bright:#eee8d5;--blue:#268bd2}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:14px/1.5 system-ui,-apple-system,"Segoe UI",sans-serif}button,input,select,textarea{font:inherit;color:inherit}button,.button{border:1px solid var(--line);border-radius:5px;padding:7px 11px;background:var(--panel);cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:6px}button:hover,.button:hover{border-color:var(--cyan);color:var(--bright)}button:disabled{opacity:.35;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:2px solid var(--yellow);outline-offset:3px}a{color:var(--cyan)}input,select,textarea{background:var(--bg);border:1px solid var(--line);border-radius:4px;padding:9px;max-width:100%}input::placeholder,textarea::placeholder{color:var(--muted)}select{cursor:pointer}input[type=checkbox]{accent-color:var(--cyan);width:16px;height:16px;padding:0}code,kbd,.mono{font:12px/1.6 Consolas,monospace;overflow-wrap:anywhere}code{color:var(--cyan)}kbd{border:1px solid var(--line);padding:0 6px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.skip{position:fixed;left:10px;top:-100px;z-index:100;background:var(--bg);padding:15px}.skip:focus{top:10px}
.top{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 3.5vw;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:13px;text-decoration:none;color:var(--bright);font-weight:650;letter-spacing:2px;font-size:16px}.brand small{display:block;font-size:9px;letter-spacing:2.3px;color:var(--muted);margin-top:2px}.star{font-size:31px;color:var(--yellow)}.top nav{display:flex;gap:8px;flex-wrap:wrap;font-size:11px}.top b{font-size:10px;border-radius:3px;padding:0 5px;background:var(--bg);color:var(--cyan)}main{max-width:1900px;margin:auto;padding:0 3.5vw}.intro{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:43px 0 36px}.eyebrow{color:var(--cyan);letter-spacing:1.8px;font-size:10px;font-weight:650;margin:0 0 12px}h1{font-size:clamp(32px,4vw,56px);line-height:1.05;font-weight:550;letter-spacing:-2px;margin:0 0 16px;color:var(--bright)}h1 span{color:var(--cyan)}.lede{color:var(--muted);margin:0;line-height:1.8;font-size:13px}.stats{display:flex;gap:25px}.stats div{border-left:1px solid var(--line);padding-left:20px}.stats b{display:block;color:var(--bright);font-size:29px;font-weight:450;letter-spacing:-1px}.stats span{color:var(--muted);font-size:10px;letter-spacing:.4px}
.workspace{display:grid;grid-template-columns:220px minmax(0,1fr);gap:29px}.filters{border-top:1px solid var(--line);font-size:11px;align-self:start}.filter-heading{display:flex;align-items:center;justify-content:space-between;padding:14px 0}.filter-heading h2{font-size:15px;color:var(--bright);margin:0}.filter-heading button{padding:3px 8px;font-size:10px}.filters label{display:block;font-size:11px;margin-bottom:13px}.filters label>select{display:block;width:100%;margin-top:5px;font-size:11px}.filters details{border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:17px 0;padding:12px 0}.filters details[open] summary{margin-bottom:17px}summary{cursor:pointer;color:var(--cyan)}.micro{font-size:10px;line-height:1.7;color:var(--muted)}.filters .checkline{display:flex;align-items:center;gap:8px;font-size:11px;margin:14px 0}.filter-foot{border-top:1px solid var(--line);margin-top:22px;padding:18px 0;font-size:10px;color:var(--muted);line-height:1.7}.filter-foot strong{color:var(--text);font-size:11px}.range{display:flex;align-items:center;gap:6px}.range input{width:46%;font-size:11px}fieldset{border:0;padding:0;margin:0 0 15px}legend{margin-bottom:6px}
.searchbar{display:flex;align-items:center;gap:10px;padding:8px 13px;background:var(--panel);border:1px solid var(--line);border-radius:6px}.searchbar>span{font-size:27px;line-height:1;color:var(--cyan)}.searchbar input{border:0;background:transparent;padding:6px 0;width:100%;outline:none;font-size:13px}.search-help{font-size:10px;color:var(--muted);margin:8px 0 14px}.search-help summary{color:var(--muted)}.search-help p{max-width:900px;line-height:1.9}.active-filters{display:flex;flex-wrap:wrap;gap:5px}.active-filters button{font-size:10px;padding:3px 7px;color:var(--cyan)}.viewbar{display:flex;justify-content:space-between;gap:12px;align-items:center;border-bottom:1px solid var(--line);padding:8px 0}.viewbar p{font-size:11px;margin:0}.view-controls{display:flex;gap:8px}.view-controls select,.view-controls button{font-size:10px;padding:6px}.utilitybar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 0 16px;font-size:10px}.utilitybar button{font-size:10px;padding:4px 8px}.backgrounds{display:flex;align-items:center;gap:8px}.utilitybar .swatch{width:17px;height:17px;min-width:17px;padding:0;border:2px solid var(--bg);border-radius:50%;outline:1px solid var(--line)}.swatch.selected{outline-color:var(--cyan)}.swatch.check{background:repeating-conic-gradient(#073642 0% 25%,#16505c 0% 50%) 50%/8px 8px}.swatch.dark{background:#001d26}.swatch.light{background:#fff}
.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}.card{border:1px solid var(--line);border-radius:7px;overflow:hidden;background:var(--panel);min-width:0}.card:hover{border-color:#416773}.canvas{background:#073642 repeating-conic-gradient(#0b3c47 0% 25%,transparent 0% 50%) 50%/20px 20px}body[data-bg=dark] .canvas{background:#001d26}body[data-bg=light] .canvas{background:#fff}.art{height:190px;display:flex;align-items:center;justify-content:center;position:relative}.art>button{border:0;background:none;width:100%;height:100%;padding:15px;cursor:zoom-in}.art img{image-rendering:pixelated;max-width:100%;max-height:156px;object-fit:contain;filter:drop-shadow(0 5px 3px #0003)}.missing-art{font-size:11px;color:var(--muted);text-align:center;padding:20px}.missing-art span{display:block;font-size:32px;color:var(--line);margin-bottom:5px}.art .favorite{position:absolute;top:8px;right:8px;width:27px;height:27px;border:1px solid var(--line);background:#002b36d9;border-radius:50%;padding:0;z-index:1;color:var(--muted);font-size:17px;cursor:pointer}.favorite.saved{color:var(--yellow);border-color:var(--yellow)}.art .art-label{position:absolute;bottom:6px;left:8px;font-size:8px;background:#002b36e6;color:var(--muted);padding:2px 5px;border-radius:3px;max-width:85%}.card-body{padding:13px}.modname{color:var(--cyan);font-size:9px;letter-spacing:.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin:0 0 5px}.card h2{font-size:15px;line-height:1.3;font-weight:600;color:var(--bright);margin:0 0 6px;overflow-wrap:anywhere}.card h2 button{all:unset;cursor:pointer}.card h2 button:focus-visible{outline:2px solid var(--yellow)}.subline{font-size:9px;color:var(--muted);line-height:1.7;min-height:16px;margin-bottom:12px}.actions{display:flex;gap:6px}.actions button{font-size:10px;padding:6px 4px;flex:1;color:var(--cyan);background:var(--bg)}.actions a{display:flex;align-items:center;justify-content:center;width:28px;border:1px solid var(--line);border-radius:4px;text-decoration:none}.actions button:disabled{color:var(--muted)}.grid.list{grid-template-columns:1fr}.list .card{display:grid;grid-template-columns:130px 1fr}.list .art{height:125px}.list .art img{max-height:95px;max-width:100px}.list .card-body{display:grid;grid-template-columns:minmax(140px,1fr) minmax(130px,1fr) 180px;align-items:center;gap:10px}.list .card h2{grid-column:1;margin:0}.list .modname{grid-column:1;margin:0;align-self:end}.list .subline{grid-column:2;grid-row:1/3;margin:0}.list .actions{grid-column:3;grid-row:1/3}.pagination{display:flex;align-items:center;justify-content:center;gap:20px;margin:30px 0;font-size:11px}.pagination button{font-size:11px}.empty{text-align:center;padding:80px 15px}.empty h2{color:var(--bright);font-weight:500}.notice{padding:12px 14px;border:1px solid var(--line);border-left:3px solid var(--yellow);background:var(--panel);font-size:12px;line-height:1.8;border-radius:4px}footer{display:flex;justify-content:space-between;gap:30px;border-top:1px solid var(--line);margin-top:35px;padding:26px 0 36px;font-size:10px;color:var(--muted)}footer strong{font-size:13px;color:var(--text)}footer p{margin:4px 0}footer button{font-size:10px}
dialog{border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--text);padding:25px;width:min(820px,95vw);max-height:94vh;overflow:auto}dialog::backdrop{background:#00151bd9;backdrop-filter:blur(4px)}dialog h2{color:var(--bright);font-size:27px;font-weight:500;line-height:1.3;margin:12px 0 6px;overflow-wrap:anywhere}.dialog-top{display:flex;justify-content:space-between;align-items:center}.dialog-top .eyebrow{margin:0}.close{background:none;border:0;padding:0 5px;font-size:29px;line-height:25px}.chips{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0}.chip{font-size:10px;background:var(--panel);border:1px solid var(--line);border-radius:4px;padding:3px 7px}.dialog-tools{display:flex;gap:7px;flex-wrap:wrap;margin:18px 0}.dialog-tools button{font-size:11px}.tabs{display:flex;border-bottom:1px solid var(--line);gap:20px;margin-bottom:18px}.tabs button{border:0;border-bottom:2px solid transparent;background:none;border-radius:0;padding:12px 0;font-size:12px}.tabs button[aria-selected=true]{color:var(--cyan);border-bottom-color:var(--cyan)}.inspector-image{height:310px;border:1px solid var(--line);border-radius:6px;display:flex;align-items:center;justify-content:center;padding:15px;overflow:auto}.inspector-image img{max-width:100%;max-height:280px;object-fit:contain;image-rendering:pixelated}.inspector-controls{display:flex;gap:15px;margin:20px 0 10px}.inspector-controls label{flex:1;font-size:11px;min-width:0}.inspector-controls select{display:block;width:100%;margin-top:5px;font-size:11px}.dialog-actions{display:flex;flex-wrap:wrap;gap:9px;margin:18px 0;font-size:11px}.primary{background:var(--cyan);color:var(--bg);border-color:var(--cyan)}.primary:hover{color:var(--bg);filter:brightness(1.1)}.palette-color{border-radius:4px;padding:5px 9px;font-size:10px}.research-section{margin:22px 0}.research-section h3{color:var(--cyan);font-size:12px;letter-spacing:.4px;margin:0 0 10px}.research-section p,.research-section li{font-size:12px;line-height:1.8;overflow-wrap:anywhere}.research-section ul{padding-left:20px}.research-section dl{display:grid;grid-template-columns:140px minmax(0,1fr);font-size:12px;gap:8px;margin:0}.research-section dt{color:var(--muted)}.research-section dd{margin:0;overflow-wrap:anywhere}.source-row{padding:10px 0;border-bottom:1px solid var(--line);font-size:11px;overflow-wrap:anywhere}.source-row small{display:block;font-size:9px;color:var(--muted)}#personal-note{display:block;width:100%;margin-top:8px;resize:vertical;line-height:1.8}#note-status{font-size:11px;color:var(--cyan)}#comparison{width:min(1450px,97vw)}#compare-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.compare-card{border:1px solid var(--line);border-radius:6px;padding:15px;font-size:11px;min-width:0}.compare-card h3{color:var(--bright);overflow-wrap:anywhere}.compare-card img{image-rendering:pixelated;object-fit:contain;max-width:100%;height:180px}.compare-card p{overflow-wrap:anywhere}.compare-card button{font-size:10px}#about p,#about li{font-size:13px;line-height:1.9}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:var(--panel);color:var(--bright);border:1px solid var(--cyan);border-radius:6px;padding:12px 20px;font-size:12px;max-width:90vw;box-shadow:0 6px 25px #0005;z-index:100;display:none}#toast.show{display:block}[hidden]{display:none!important}
@media(min-width:1700px){.grid{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(max-width:1250px){.grid{grid-template-columns:repeat(3,minmax(0,1fr))}.stats{gap:15px}.stats div{padding-left:13px}.stats b{font-size:24px}.workspace{grid-template-columns:195px minmax(0,1fr);gap:22px}.art{height:175px}.art img{max-height:145px}}
@media(max-width:970px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.intro{align-items:flex-start}.stats{display:grid;grid-template-columns:1fr 1fr;gap:8px}.stats b{font-size:22px}.stats span{font-size:9px}.top nav{max-width:310px;justify-content:flex-end}.list .card-body{display:block}.list .actions{margin-top:8px}.viewbar{align-items:flex-start;flex-direction:column}.view-controls{align-self:flex-end}#compare-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:680px){.top{padding:16px 5vw;align-items:flex-start}.brand{font-size:12px;letter-spacing:1px;gap:7px}.brand small{font-size:7px}.star{font-size:24px}.top nav{gap:5px;max-width:175px}.top nav button,.top nav .button{font-size:9px;padding:5px}main{padding:0 5vw}.intro{display:block;padding:30px 0 23px}h1{font-size:36px;letter-spacing:-1.4px}.stats{display:flex;gap:22px;margin-top:22px}.stats div{padding-left:12px}.workspace{display:block}.filters{display:grid;grid-template-columns:1fr 1fr;gap:0 12px;margin-bottom:20px}.filter-heading{grid-column:1/-1}.filters .micro,.filters .filter-foot{display:none}.filters details{grid-column:1/-1;margin:3px 0 12px}.filters .checkline{margin:4px 0}.grid{gap:12px}.card-body{padding:11px}.card h2{font-size:14px}.art{height:165px}.art img{max-height:135px}.subline{font-size:8px}.utilitybar{font-size:9px}.viewbar{flex-direction:row;align-items:center}.view-controls{align-self:auto}.view-controls select{max-width:115px}.viewbar p{font-size:10px}.stats span{font-size:9px}.stats b{font-size:24px}footer{display:block}dialog{padding:18px}.inspector-image{height:240px}.inspector-image img{max-height:210px}.dialog-tools button{font-size:10px}.tabs{gap:14px}.tabs button{font-size:11px}.research-section dl{grid-template-columns:110px minmax(0,1fr)}.list .card{grid-template-columns:100px 1fr}.list .art img{max-width:85px}.list .card-body{padding:10px}#compare-grid{grid-template-columns:1fr}.compare-card img{height:150px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}