/* ICO to Base64 (2026-10-09) - prefix i2b. Builds on styles/ci-tool.css (.ci classes). */
.i2b .i2b-grid { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: 1.1rem; align-items: start; }
.i2b .i2b-left, .i2b .i2b-right { min-width: 0; }
.i2b .ci-opt-block { margin-bottom: 0.875rem; }
.i2b .i2b-sizes { margin-bottom: 0.875rem; padding: 0.75rem; border: 1px solid var(--ci-line); border-radius: 12px; background: var(--ci-card); transition: opacity 0.2s; }
.i2b .i2b-sizes.is-dim .ci-pg { opacity: 0.75; }
.i2b .i2b-sizes .ci-caption { display: flex; margin: 0 0 0.55rem; }
.i2b .i2b-size-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(68px, 1fr)); gap: 0.45rem; }
.i2b .i2b-size { cursor: pointer; }
.i2b .i2b-preview { position: relative; display: flex; align-items: center; justify-content: center; min-height: 170px; padding: 1rem; border: 1px solid var(--ci-line); border-radius: 12px; overflow: hidden; }
.i2b .i2b-preview img { max-width: 100%; max-height: 220px; image-rendering: pixelated; }
.i2b .i2b-preview img:not([src]) { display: none; }
.i2b .i2b-preview-label { position: absolute; left: 8px; bottom: 8px; padding: 0.15rem 0.5rem; border-radius: 999px; border: 1px solid var(--ci-line); background: var(--ci-card); font-size: 0.7rem; font-weight: 700; color: var(--ci-text-2); }
.i2b .i2b-fmts { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.i2b .i2b-fmts .ci-chip { flex: 0 0 auto; }
.i2b .i2b-wrap { margin-top: 0.7rem; }
.i2b .i2b-code-wrap { position: relative; }
.i2b .i2b-code {
    display: block; width: 100%; min-height: 190px; box-sizing: border-box; margin: 0; padding: 0.8rem 0.9rem; resize: vertical;
    border: 1px solid var(--ci-line); border-radius: 12px; background: var(--ci-sunk); color: var(--ci-text-1);
    font: 0.78rem/1.5 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; word-break: break-all; white-space: pre-wrap;
}
.i2b .i2b-code:focus { outline: none; border-color: var(--ci-c); box-shadow: 0 0 0 3px var(--ci-accent-soft); }
.i2b .i2b-code-busy { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; border-radius: 12px; background: color-mix(in srgb, var(--ci-card) 70%, transparent); }
.i2b .i2b-code-busy .ci-loader { width: 46px; height: 46px; }
.i2b .i2b-stats { display: flex; flex-wrap: wrap; gap: 0.3rem 0.9rem; margin: 0.55rem 0 0.8rem; font-size: 0.8rem; color: var(--ci-muted); font-variant-numeric: tabular-nums; }
.i2b .i2b-stats strong { color: var(--ci-text-1); }
.i2b .i2b-actions { display: flex; flex-wrap: wrap; gap: 0.6rem; align-items: center; }
.i2b .i2b-actions .ci-go { flex: 1 1 auto; justify-content: center; }
.i2b .ci-btn.is-done { background: var(--ci-ok); border-color: var(--ci-ok); color: #fff; }
.i2b [hidden] { display: none !important; }
@media (max-width: 860px) {
    .i2b .i2b-grid { grid-template-columns: minmax(0, 1fr); }
}