/* Image Share */
.img-drop { border: 2px dashed var(--border-color); border-radius: 12px; padding: 2.2rem 1rem; text-align: center; cursor: pointer; transition: border-color .15s, background .15s; }
.img-drop:hover, .img-drop:focus, .img-drop.over { border-color: var(--accent-color); background: rgba(76, 175, 80, .07); outline: none; }
.img-drop-icon { font-size: 2.6rem; line-height: 1; margin-bottom: .4rem; }
.img-drop p { margin: .25rem 0; }
.linklike { color: var(--accent-color); text-decoration: underline; cursor: pointer; background: none; border: 0; padding: 0; font: inherit; }
.img-options { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 1rem; }
.img-options label { display: flex; flex-direction: column; gap: .3rem; font-size: .9rem; flex: 1 1 220px; }
.img-options input, .img-options select { padding: .55rem .7rem; border: 1px solid var(--border-color); border-radius: 8px; background: var(--bg-primary); color: var(--text-primary); font: inherit; }
.img-rules { margin-top: .9rem; }
.img-results { display: grid; gap: .8rem; margin-top: .8rem; }
.img-card { display: flex; gap: .9rem; padding: .8rem; border: 1px solid var(--border-color); border-radius: 10px; background: var(--bg-primary); }
.img-card.img-failed { border-color: #e57373; }
.img-thumb { width: 96px; height: 96px; object-fit: cover; border-radius: 8px; flex: none; background: #0003; }
.img-card-body { flex: 1; min-width: 0; display: grid; gap: .35rem; }
.img-card-body strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.img-card-body strong a { color: var(--accent-color); }
.img-progress { height: 6px; background: var(--border-color); border-radius: 3px; overflow: hidden; }
.img-progress span { display: block; height: 100%; width: 0; background: var(--accent-color); transition: width .2s; }
.img-code-row, .img-codes label { display: grid; grid-template-columns: 9.5rem 1fr; gap: .5rem; align-items: center; font-size: .85rem; }
.img-code { display: flex; gap: .4rem; min-width: 0; }
.img-code input { flex: 1; min-width: 0; padding: .4rem .55rem; border: 1px solid var(--border-color); border-radius: 6px; background: var(--bg-secondary); color: var(--text-primary); font: .82rem ui-monospace, Menlo, Consolas, monospace; }
.btn-sm { padding: .35rem .7rem; font-size: .82rem; }
.btn-danger { background: #d32f2f; border-color: #d32f2f; color: #fff; }
.img-del-row span:first-child { color: #e57373; }
.img-mine { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: .6rem; }
.img-mine-item { position: relative; }
.img-mine-item img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 8px; display: block; border: 1px solid var(--border-color); }
.img-mine-del { position: absolute; right: 4px; bottom: 4px; font-size: .72rem; background: rgba(0, 0, 0, .65); color: #fff; padding: 2px 6px; border-radius: 4px; text-decoration: none; }
.img-page { max-width: 1100px; }
.img-title { margin: .5rem 0 1rem; font-size: 1.5rem; }
.img-figure { margin: 0 0 1rem; text-align: center; }
.img-figure img { max-width: 100%; height: auto; max-height: 80vh; border-radius: 8px; background: repeating-conic-gradient(#8882 0 25%, transparent 0 50%) 50% / 20px 20px; }
.img-figure figcaption { color: var(--text-secondary); font-size: .85rem; margin-top: .5rem; }
.img-codes { display: grid; gap: .5rem; }
.img-actions { margin-top: 1rem; font-size: .9rem; }
.img-gone { text-align: center; padding: 2.5rem 1rem; }
.img-delete { border-color: #d32f2f; }
.img-dialog { border: 1px solid var(--border-color); border-radius: 12px; background: var(--bg-secondary); color: var(--text-primary); max-width: 440px; width: calc(100% - 32px); padding: 1.2rem; }
.img-dialog::backdrop { background: rgba(0, 0, 0, .6); }
.img-radio { display: block; margin: .3rem 0; }
.img-note { display: flex; flex-direction: column; gap: .3rem; margin-top: .6rem; font-size: .9rem; }
.img-note textarea { padding: .5rem; border: 1px solid var(--border-color); border-radius: 8px; background: var(--bg-primary); color: var(--text-primary); font: inherit; }
@media (max-width: 600px) { .img-code-row, .img-codes label { grid-template-columns: 1fr; gap: .25rem; } .img-thumb { width: 64px; height: 64px; } }
.panel a:not(.btn):not(.img-mine-del) { color: var(--accent-color); }