:root{font-family:system-ui,sans-serif;color:#173149;background:#f7f2e7;font-size:18px}*{box-sizing:border-box}body{margin:0}main{max-width:1000px;margin:auto;padding:28px}header{border-bottom:3px solid #e8b757;margin-bottom:24px}h1{font-size:clamp(36px,5vw,58px);line-height:1.03;margin:10px 0 18px}h2{font-size:25px;margin-top:24px}h3{margin-top:0;font-size:19px}p{line-height:1.55}.eyebrow{font-size:13px;letter-spacing:.13em;font-weight:800;color:#087369}section{background:white;border:1px solid #d9dedb;border-radius:18px;padding:24px}label{display:block;font-weight:650;margin-bottom:9px}button,select,input{font:inherit}button,select,.file-label{border:2px solid #173149;border-radius:9px;min-height:46px;padding:10px 14px}button,select{cursor:pointer}button{font-weight:650}select{width:100%;background:white;color:#173149;margin-bottom:16px}.primary{background:#126d62;color:white;border-color:#126d62;margin:14px 0}.secondary,.file-label{background:#fff7df;color:#173149}button:focus-visible,select:focus-visible,input:focus-visible,a:focus-visible{outline:4px solid #bf491f;outline-offset:3px}.layout{display:grid;grid-template-columns:300px 1fr;gap:35px}.pixels{display:grid;grid-template-columns:repeat(6,1fr);gap:3px;max-width:300px;margin-bottom:16px}.pixel{min-height:0;aspect-ratio:1;border:1px solid #7b8d98;padding:0;border-radius:4px;background:#fff8e7}.pixel[aria-pressed=true]{background:#126d62}.samples{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:26px}.sample{text-align:center;font-size:14px}.sample svg{width:100%;max-width:90px;display:block;margin:0 auto 8px}.note,footer{color:#44586b;font-size:15px}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px;align-items:center}.file-label{font-weight:500;max-width:100%;margin:0}.file-label input{display:block;font-size:14px;max-width:100%;margin-top:8px}.status{background:#dff0e8;border-left:5px solid #126d62;padding:16px;border-radius:5px;min-height:60px}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;max-width:700px;margin:20px auto}.card{aspect-ratio:1;min-width:0;background:#173149;color:white;font-size:32px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:5px;padding:10px}.card svg{width:80%;max-height:110px}.card span{font-size:15px}.card.open{background:#fff7df;color:#173149}.card.matched{background:#def2e9;color:#173149;border:3px solid #126d62}button[aria-disabled=true]{cursor:default}footer{margin:24px 0 8px}[hidden]{display:none!important}@media(max-width:650px){main{padding:14px}section{padding:16px}.layout{grid-template-columns:1fr;gap:24px}.pixels{max-width:300px}.cards{grid-template-columns:repeat(2,1fr)}.samples{gap:6px}.actions>*{width:100%}}