:root{font-family:Inter,"Noto Sans SC",system-ui,sans-serif;color:#dce4f1;background:#0b101b;color-scheme:dark;font-synthesis:none}
*{box-sizing:border-box}body{margin:0}main{max-width:1160px;margin:auto;padding:48px 24px}header{margin-bottom:32px}h1{font-size:clamp(28px,4vw,42px);letter-spacing:-.04em;margin:18px 0 12px}header p,.hint,footer{color:#9baac1;font-size:14px;line-height:1.7}.badge{color:#79dbc9;font-size:12px;letter-spacing:.15em}.pair{display:grid;grid-template-columns:1fr 1fr;gap:20px}.panel{background:#131c2b;border:1px solid #293448;border-radius:16px;padding:22px;margin-bottom:20px;min-width:0}h2{font-size:18px;margin:0 0 18px}h2 span{color:#79dbc9;margin-right:8px;font-size:13px}h3{font-size:16px;margin:0 0 12px}summary{cursor:pointer;font-weight:600}label{font-size:13px;display:block;color:#b8c6da}input{display:block;width:100%;padding:11px 12px;margin-top:9px;border:1px solid #38475e;border-radius:8px;background:#0c1422;color:#e7edf5;font:inherit}input:focus{outline:2px solid #6ccfbf;outline-offset:2px}.upload{border:1px dashed #4b607a;border-radius:10px;padding:10px 14px;background:#101a29}.upload input{border:0;padding:0}.preview{width:100%;height:250px;object-fit:contain;margin-top:16px;background:#080e17;border-radius:8px}.settings{margin-top:20px}.triple{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.actions{display:flex;gap:12px}button{background:#79dbc9;color:#0c201e;font:inherit;font-weight:700;border:0;padding:13px 24px;border-radius:9px;cursor:pointer}.secondary{background:#243046;color:#dce4f1}button:disabled{opacity:.5;cursor:wait}#status{padding:16px 0;color:#83ddcd;overflow-wrap:anywhere}#status.error{color:#ffacac}.result-heading{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}#summary{font-size:13px;color:#9baac1}.result-image{display:block;width:100%;max-height:620px;object-fit:contain;background:#080e17;border-radius:8px;margin:16px 0}a{color:#8dded0;font-size:13px}pre{overflow:auto;background:#0c1422;padding:20px;border-radius:8px;font-size:14px;line-height:1.6}footer{border-top:1px solid #293448;padding-top:24px;margin-top:30px}[hidden]{display:none!important}@media(max-width:700px){main{padding:28px 16px}.pair,.triple{grid-template-columns:1fr}.panel{padding:18px}.preview{height:220px}}
.sample-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.sample-card{padding:10px;background:#1d2b40;color:#dce4f1;text-align:left;font-size:13px;border:1px solid #354761;font-weight:500}.sample-card:hover{border-color:#79dbc9}.sample-thumbs{display:flex;gap:3px;margin-bottom:8px}.sample-thumbs img{width:calc(50% - 2px);height:70px;object-fit:contain;background:#080e17;border-radius:4px}#label-a,#label-b{font-size:18px;color:inherit;margin:0}@media(max-width:900px){.sample-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:500px){.sample-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Hide browser-localized file text while retaining the native, keyboard-accessible picker. */
.upload{position:relative;display:flex;align-items:center;gap:12px;cursor:pointer}
.upload input[type=file]{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.upload:focus-within{outline:2px solid #6ccfbf;outline-offset:2px}
.file-button{display:inline-block;flex-shrink:0;padding:10px 14px;border-radius:8px;background:#243046;color:#dce4f1;font-weight:600}
.file-name{min-width:0;overflow-wrap:anywhere}
