:root{color-scheme:light;--ink:#202525;--muted:#69716e;--paper:#f5f5ef;--line:#dddfd5;--accent:#eeae29;--white:#fff;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:var(--paper)}
*{box-sizing:border-box}body{margin:0}button,input,a{font:inherit}button,a,input{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--accent);outline-offset:3px}a{color:inherit}[hidden]{display:none!important}
.topbar{background:var(--ink);color:var(--white);padding:22px 5vw;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{font-weight:800;letter-spacing:2px;text-decoration:none}.brand span{font-size:12px;font-weight:400;letter-spacing:0;display:block;margin-top:5px;color:#d2d7cd}.status{font-size:12px;color:#d2d7cd}main{max-width:1440px;margin:auto;padding:48px 5vw}.intro{display:flex;justify-content:space-between;align-items:center;gap:32px;margin-bottom:32px}.eyebrow{font:11px monospace;letter-spacing:1.5px;color:var(--muted)}h1{font-size:clamp(30px,4vw,50px);letter-spacing:-1.5px;margin:12px 0}.lead{max-width:650px;line-height:1.7;color:var(--muted)}.stats{border-left:3px solid var(--accent);padding:12px 24px;white-space:nowrap}.stats strong{display:block;font-size:48px}.stats span{font-size:12px;color:var(--muted)}.notice{border:1px solid var(--line);border-left:3px solid var(--accent);background:#fffaf0;padding:18px 22px;margin-bottom:38px}.notice p{margin:7px 0 0;color:var(--muted);line-height:1.6;font-size:14px}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.card{display:flex;flex-direction:column;min-width:0;text-align:left;padding:0;background:var(--white);border:1px solid var(--line);color:var(--ink)}.card img{width:100%;height:auto;aspect-ratio:1;object-fit:contain;background:white}.card h3{font-size:13px;line-height:1.5;overflow-wrap:anywhere;margin:0}.card p{font-size:11px;line-height:1.6;color:var(--muted)}.card-body{padding:16px;border-top:1px solid var(--line)}.card:hover{border-color:#8c958b}footer{border-top:1px solid var(--line);margin-top:40px;padding:24px 0;font-size:12px;color:var(--muted)}
.toolbar{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:20px}.toolbar h2{font-size:24px;margin:0;letter-spacing:-0.5px}.search{display:flex;flex-direction:column;gap:6px;min-width:min(320px,100%)}.search span{font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--muted)}.search input{border:1px solid var(--line);background:var(--white);padding:12px 14px;min-height:44px;color:var(--ink)}#filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:16px}.filter{display:flex;align-items:center;gap:8px;min-height:40px;padding:8px 14px;border:1px solid var(--line);background:var(--white);color:var(--ink);font-size:13px}.filter .count{font-size:11px;background:var(--paper);border:1px solid var(--line);padding:2px 8px;color:var(--muted)}.filter[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);font-weight:700}.filter[aria-pressed="true"] .count{background:var(--white);border-color:transparent;color:var(--ink)}#result-count{font-size:12px;color:var(--muted);margin:0 0 16px}#empty,#error{padding:18px 22px;border:1px solid var(--line);background:var(--white);font-size:14px}#error{border-left:3px solid #c0392b}#empty{border-left:3px solid var(--accent)}.img-error{display:flex;align-items:center;justify-content:center;aspect-ratio:1;margin:0;background:var(--paper);color:var(--muted);font-size:12px}
#viewer{border:1px solid var(--line);padding:0;max-width:min(1100px,95vw);max-height:94dvh;width:min(1100px,95vw);background:var(--white);color:var(--ink);overflow:auto}#viewer::backdrop{background:rgba(20,24,23,0.72)}.viewer-header{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;padding:22px 26px;border-bottom:1px solid var(--line)}.viewer-header h2{font-size:18px;margin:6px 0;overflow-wrap:anywhere}.viewer-header p{margin:0}#viewer-meta{font-size:12px;color:var(--muted)}.viewer-stage{display:flex;align-items:center;justify-content:center;padding:24px;background:var(--paper)}#viewer-image{max-width:100%;max-height:65dvh;object-fit:contain;background:var(--white)}.viewer-actions{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 26px;border-top:1px solid var(--line);flex-wrap:wrap}.viewer-actions button,#close-viewer,#open-original{min-height:40px;padding:10px 18px;border:1px solid var(--line);background:var(--white);color:var(--ink);text-decoration:none;display:inline-flex;align-items:center;font-size:13px}.viewer-actions button:hover:not(:disabled),#close-viewer:hover,#open-original:hover{border-color:#8c958b}.viewer-actions button:disabled{opacity:0.45;cursor:default}#close-viewer{background:var(--ink);color:var(--white);border-color:var(--ink)}
#results-section{margin:36px 0 48px}.results-intro{max-width:850px;color:var(--muted);line-height:1.6}.comparison{margin-top:30px;padding-top:24px;border-top:1px solid var(--line)}.comparison h3{margin:0 0 8px}.comparison-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:18px}.result-card{min-width:0;border:1px solid var(--line);background:var(--white)}.result-image{display:block;width:100%;padding:0;border:0;background:white;cursor:pointer}.result-image img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain}.result-placeholder{aspect-ratio:1;display:grid;place-content:center;padding:24px;text-align:center;background:var(--paper);color:var(--muted)}.result-header,.result-info,.result-review{padding:16px}.result-review{border-top:1px solid var(--line);font-size:13px;line-height:1.6}.result-review ul{padding-left:18px}.result-status{display:inline-block;font-size:11px;padding:5px 8px;background:var(--paper);border:1px solid var(--line)}#refresh-results{min-height:42px;padding:10px 16px;background:var(--ink);color:white;border:1px solid var(--ink)}.comparison details{font-size:12px;line-height:1.6;color:var(--muted);margin-top:12px}.comparison summary{cursor:pointer}.result-info{font-size:12px;line-height:1.6;color:var(--muted)}@media(max-width:750px){.comparison-grid{grid-template-columns:1fr}}
.result-header{border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:8px;align-items:flex-start}.result-status[data-status="succeeded"]{background:var(--accent);border-color:var(--accent);color:var(--ink);font-weight:700}.result-status[data-status="failed"]{border-color:#c0392b;color:#c0392b}.comparison-spec{margin:0;font-size:13px;color:var(--muted);line-height:1.6}.result-cue{display:block;padding:10px 16px;font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--muted);border-top:1px solid var(--line);text-align:left}.result-image:hover .result-cue{color:var(--ink)}.result-placeholder p{margin:0}.result-failure{font-size:12px;color:#c0392b}.result-review p{margin:8px 0 0}.result-review strong{display:block;font-size:12px;letter-spacing:1px;text-transform:uppercase;color:var(--muted)}#results-status{font-size:13px;color:var(--muted);margin:14px 0 0}
#composer-section{margin:36px 0 48px}.composer-form{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:14px}.composer-form label{display:flex;flex-direction:column;gap:6px;min-width:0}.composer-form span{font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--muted)}.composer-form select{min-height:44px;padding:10px 12px;border:1px solid var(--line);background:var(--white);color:var(--ink)}.composer-note{max-width:850px;color:var(--muted);line-height:1.6}#composer-status{font-size:13px;color:var(--muted);margin:10px 0 16px}.composer-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}.composer-card{min-width:0;border:1px solid var(--line);background:var(--white)}.composer-card h3{margin:0;padding:14px 14px 0;font-size:13px;line-height:1.4}.composer-image{display:block;width:100%;padding:0;border:0;background:white;cursor:pointer}.composer-image img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:contain}#compose-preview{min-height:42px;padding:10px 16px;background:var(--ink);color:white;border:1px solid var(--ink)}
@media(max-width:1100px){.composer-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.composer-form{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){main{padding:28px 18px}.intro{align-items:flex-start}.stats{padding:8px 12px}.stats strong{font-size:32px}.stats span{white-space:normal;display:block;max-width:90px}.status{max-width:110px;line-height:1.5}.grid{grid-template-columns:1fr;gap:16px}.composer-form,.composer-grid{grid-template-columns:1fr}.toolbar{flex-direction:column;align-items:stretch}.viewer-actions{justify-content:center}.viewer-header{flex-direction:column}.topbar{padding:18px 5vw}}