
:root{--ink:#1a1a1a;--bg:#fafaf8;--card:#fff;--line:#e5e3de;--accent:#2563eb}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:-apple-system,"Hiragino Sans",sans-serif;background:var(--bg);color:var(--ink);line-height:1.7;padding:1rem}
main{max-width:640px;margin:0 auto}
h1{font-size:1.25rem;margin:.5rem 0}
.lead{font-size:.9rem;color:#555;margin-bottom:1rem}
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:1rem;margin-bottom:1rem}
#status{font-size:.85rem;color:#666;margin-bottom:.5rem}
#drop{border:2px dashed var(--line);border-radius:12px;padding:1.5rem;text-align:center;cursor:pointer}
#preview{max-width:100%;border-radius:8px;margin:.5rem 0;display:none}
#result{display:none}
#result .verdict{font-size:1.4rem;font-weight:700;margin:.5rem 0}
.bars{margin-top:.75rem}
.bar{display:flex;align-items:center;gap:.5rem;font-size:.8rem;margin:.25rem 0}
.bar .label{width:9em;flex-shrink:0}
.bar .track{flex:1;background:#eee;border-radius:4px;height:14px;overflow:hidden}
.bar .fill{height:100%;background:var(--accent);transition:width .3s}
.bar .pct{width:3.5em;text-align:right}
.note{font-size:.78rem;color:#777;margin-top:1rem}
.sample-row{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.5rem}
.sample-row img{width:72px;height:72px;object-fit:cover;border-radius:8px;cursor:pointer;border:2px solid transparent}
.sample-row img:hover{border-color:var(--accent)}

.drop-sub{font-size:.75rem;display:block;color:#999}
.hidden{display:none}
.h2-sm{font-size:.95rem}
.list-sm{font-size:.85rem;padding-left:1.2rem}
.backlink{font-size:.8rem;margin-top:1rem}
.backlink a{color:var(--accent)}
