:root { --bg:#0b1020; --fg:#e6e9f2; --muted:#9aa3b2; --card:#151c33; --accent:#7aa2ff; }
*{box-sizing:border-box;}
body{margin:0;background:var(--bg);color:var(--fg);font:16px/1.5 system-ui, -apple-system, Segoe UI, Roboto, sans-serif;}
.container{max-width:980px;margin:32px auto;padding:0 16px;}
h1{margin:0 0 16px;font-size:28px;}
.controls{display:grid;grid-template-columns:1fr 1fr;gap:12px;background:var(--card);padding:16px;border-radius:16px;box-shadow:0 6px 20px rgba(0,0,0,.25);}
.controls label{grid-column:span 2;color:var(--muted);font-size:12px;letter-spacing:.04em;text-transform:uppercase;}
.controls input, .controls select, .controls button{
  width:100%;padding:10px 12px;border-radius:10px;border:1px solid #2b355a;background:#0f1630;color:var(--fg);
}
#search{grid-column:span 2;}
#commodity{grid-column:span 2;}
#kind{grid-column:span 1;}
#show{grid-column:span 1;background:var(--accent);border:none;color:#06102a;font-weight:700;cursor:pointer}
#show:hover{filter:brightness(1.05)}
.viewer{margin-top:18px;background:#0f1630;border-radius:16px;padding:12px;min-height:200px;display:flex;align-items:center;justify-content:center}
.viewer img{max-width:100%;height:auto;border-radius:8px}
.hint{margin-top:8px;color:var(--muted)}