:root{
--ink: #10141c;
--ink-2: #1a2130;
--paper: #eef0f4;
--paper-dim: #a9b1c4;
--amber: #e8a33d;
--amber-dim: #6b5326;
--line: #2a3345;
--good: #6fbf8b;
--bad: #d97066;
}
*{box-sizing:border-box;}
body{
margin:0;
background:var(--ink);
color:var(--paper);
font-family:'IBM Plex Mono', monospace;
min-height:100vh;
padding:48px 24px 80px;
}
.wrap{max-width:880px;margin:0 auto;}
header{margin-bottom:36px;border-bottom:1px solid var(--line);padding-bottom:28px;}
.eyebrow{
font-size:11px;letter-spacing:.18em;text-transform:uppercase;
color:var(--amber);margin-bottom:10px;font-weight:600;
}
h1{
font-family:'Fraunces', serif;
font-weight:600;
font-size:clamp(28px,4vw,42px);
margin:0 0 10px;
letter-spacing:-.01em;
}
header p{color:var(--paper-dim);font-size:14px;line-height:1.6;margin:0;max-width:520px;}

.dropzone{
border:1px dashed var(--line);
border-radius:2px;
padding:36px 24px;
text-align:center;
cursor:pointer;
transition:border-color .15s, background .15s;
background:var(--ink-2);
margin-bottom:24px;
}
.dropzone:hover, .dropzone.drag{
border-color:var(--amber);
background:#1e2636;
}
.dropzone .icon{font-size:22px;color:var(--amber);margin-bottom:10px;font-family:'Fraunces',serif;}
.dropzone .main{font-size:14px;color:var(--paper);}
.dropzone .sub{font-size:12px;color:var(--paper-dim);margin-top:6px;}
#fileInput{display:none;}

.controls{
display:flex;flex-wrap:wrap;gap:20px;align-items:flex-end;
padding:18px 20px;background:var(--ink-2);border:1px solid var(--line);
margin-bottom:20px;border-radius:2px;
}
.field{display:flex;flex-direction:column;gap:6px;}
.field label{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--paper-dim);}
.field input[type=number]{
width:80px;background:var(--ink);border:1px solid var(--line);color:var(--paper);
font-family:inherit;font-size:14px;padding:7px 9px;border-radius:2px;
}
.field input[type=number]:focus{outline:1px solid var(--amber);border-color:var(--amber);}
.toggle{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--paper);cursor:pointer;}
.toggle input{accent-color:var(--amber);width:15px;height:15px;cursor:pointer;}
.spacer{flex:1;}
button{
font-family:inherit;font-size:13px;font-weight:600;letter-spacing:.03em;
background:var(--amber);color:#1a1204;border:none;padding:10px 18px;
border-radius:2px;cursor:pointer;transition:filter .15s;
}
button:hover{filter:brightness(1.08);}
button:disabled{background:var(--line);color:var(--paper-dim);cursor:not-allowed;}
button.ghost{background:transparent;border:1px solid var(--line);color:var(--paper);}
button.ghost:hover{border-color:var(--amber);color:var(--amber);filter:none;}

#status{font-size:12.5px;color:var(--paper-dim);margin-bottom:10px;min-height:16px;}
#progressTrack{
height:3px;background:var(--line);border-radius:2px;overflow:hidden;margin-bottom:24px;
display:none;
}
#progressBar{height:100%;width:0%;background:var(--amber);transition:width .12s linear;}

#results{display:none;}
.results-head{
display:flex;justify-content:space-between;align-items:baseline;
border-bottom:1px solid var(--line);padding-bottom:10px;margin-bottom:4px;
}
.results-head h2{font-family:'Fraunces',serif;font-size:19px;font-weight:600;margin:0;}
.results-head .meta{font-size:12px;color:var(--paper-dim);}

.row{
display:grid;grid-template-columns:34px 130px 1fr 60px;align-items:center;
gap:14px;padding:9px 0;border-bottom:1px solid #1c2333;
}
.row .rank{color:var(--amber-dim);font-size:12px;}
.row .word{font-size:14px;color:var(--paper);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.row .bartrack{height:9px;background:#1c2333;border-radius:1px;}
.row .bar{height:100%;background:linear-gradient(90deg,var(--amber-dim),var(--amber));border-radius:1px;}
.row .count{font-size:12.5px;color:var(--paper-dim);text-align:right;}

.footer-actions{display:flex;gap:10px;margin-top:22px;}
#emptyErr{color:var(--bad);font-size:13px;margin-top:8px;display:none;}