/* 자동 생성 — .tools/landing/src/imageconverter/appcss.php (앱 2.1.0 main.css 그대로, 범위만 좁힘). 직접 고치지 말 것 */
.ic-win {--bg: #ffffff; --surface: #f5f5f7; --border: #e0e0e0; --text: #1a1a1a; --text-muted: #888888; --btn-bg: #ffffff; --accent: #3d84dd; --accent-hot: #5090e0; --accent-contrast: #ffffff; --sel-bg: #cce8ff; --sel-text: #1a1a1a; --nav-on-bg: #ddeefc; --nav-on-border: #a8cce6; --scroll-thumb: #dcdcdc; --disabled: #b0b0b0;}
.ic-win, .ic-win * {box-sizing: border-box; margin: 0; padding: 0;}
.ic-win .ic-app {height: 100%;}
.ic-win {font-family: "Segoe UI", system-ui, sans-serif; font-size: 12px; color: var(--text); background: var(--bg); line-height: 1.4; user-select: none;}
.ic-win input {user-select: text;}
.ic-win button, .ic-win input, .ic-win select {font-family: inherit; font-size: inherit; color: inherit;}
.ic-win .ic-app {display: flex; flex-direction: column; background: var(--bg);}
.ic-win .hidden {display: none;}
.ic-win .btn {padding: 7px 14px; text-align: center; border: 1px solid var(--border); border-radius: 8px; background: var(--btn-bg); color: var(--text); cursor: default; transition: background 120ms ease, border-color 120ms ease;}
.ic-win .btn:hover:not(:disabled) {border-color: var(--text-muted);}
.ic-win .btn:disabled {opacity: 0.5;}
.ic-win input[type=text], .ic-win input[type=number], .ic-win select {padding: 6px 10px; border: 1px solid var(--border); border-radius: 8px; background: var(--btn-bg); color: var(--text); transition: border-color 120ms ease;}
.ic-win input:hover:not(:disabled), .ic-win select:hover:not(:disabled) {border-color: var(--text-muted);}
.ic-win input:focus, .ic-win select:focus {border-color: var(--accent); outline: none;}
.ic-win input:disabled, .ic-win select:disabled {opacity: 0.5;}
.ic-win select {height: 32px; cursor: default;}
.ic-win[dir="rtl"] select {padding-right: 30px;}
.ic-win input[type=checkbox], .ic-win input[type=radio] {width: 16px; height: 16px; flex-shrink: 0; margin: 0; padding: 0; border: 1px solid var(--text-muted); border-radius: 4px; background: var(--btn-bg); color: var(--accent-contrast); transition: background 120ms ease, border-color 120ms ease;}
.ic-win input[type=radio] {border-radius: 8px; color: var(--btn-bg);}
.ic-win input[type=checkbox]:checked, .ic-win input[type=radio]:checked {background: var(--accent); border-color: var(--accent);}
.ic-win input[type=checkbox]:disabled, .ic-win input[type=radio]:disabled {opacity: 0.5;}
.ic-win .page {flex: 1; min-height: 0; display: flex;}
.ic-win .page.hidden {display: none;}
.ic-win .home {flex-direction: column; padding: 8px 8px 8px;}
.ic-win .list {flex: 1; min-height: 0; overflow: auto; border: 1px solid var(--border); background: var(--bg);}
.ic-win .list table {width: 100%; table-layout: fixed; border-collapse: collapse;}
.ic-win .list th {position: sticky; top: 0; height: 24px; padding: 0 6px; text-align: start; font-weight: normal; background: var(--surface); border-bottom: 1px solid var(--border);}
.ic-win .list th.c-type, .ic-win .list th.c-status {width: 60px; border-inline-start: 1px solid var(--border);}
.ic-win .list td {height: 20px; padding: 0 6px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.ic-win .list tr.sel td {background: var(--sel-bg); color: var(--sel-text);}
.ic-win .bottom {height: 48px; flex-shrink: 0; display: flex; align-items: center; gap: 6px; padding: 0 0 0 4px;}
.ic-win .bottom select {width: 90px; height: 30px;}
.ic-win .size {display: flex; align-items: center; height: 30px; border: 1px solid var(--border); border-radius: 8px; background: var(--btn-bg); transition: border-color 120ms ease;}
.ic-win .size:hover {border-color: var(--text-muted);}
.ic-win .size.hidden {display: none;}
.ic-win .size input {width: 56px; height: 28px; padding: 0 2px 0 10px; border: none; background: transparent;}
.ic-win[dir="rtl"] .size input {padding: 0 10px 0 2px;}
.ic-win .size .drop {width: 22px; height: 28px; border: none; background: transparent; color: var(--text); font-size: 11px;}
.ic-win .grow {flex: 1;}
.ic-win .outline {width: 120px; height: 30px; border: 1px solid var(--accent); border-radius: 8px; background: transparent; color: var(--text); transition: background 120ms ease, color 120ms ease;}
.ic-win .outline:hover:not(:disabled), .ic-win .outline:active:not(:disabled) {background: var(--accent-hot); color: #ffffff;}
.ic-win .outline:disabled {border-color: var(--disabled); color: var(--disabled);}
.ic-win .progress {height: 17px; flex-shrink: 0; background: var(--surface); border-top: 1px solid var(--border);}
.ic-win .progress.hidden {display: none;}
.ic-win .progress .bar {height: 100%; width: 0; background: var(--accent);}
.ic-win .settings .sidebar {width: 120px; flex-shrink: 0; display: flex; flex-direction: column; background: var(--bg); border-inline-end: 1px solid var(--border);}
.ic-win .settings .cats {display: flex; flex-direction: column; gap: 12px; padding: 8px 7px 8px 8px;}
.ic-win .settings .cat {height: 32px; border: 1px solid transparent; border-radius: 5px; background: transparent; color: var(--text);}
.ic-win .settings .cat:hover, .ic-win .settings .cat.on {background: var(--nav-on-bg); border-color: var(--nav-on-border);}
.ic-win .settings .content {flex: 1; min-width: 0; display: flex; flex-direction: column;}
.ic-win .settings .pane-head {height: 56px; flex-shrink: 0; padding: 18px 24px 0; border-bottom: 1px solid var(--border);}
.ic-win .settings .pane-title {font-size: 19px; font-weight: 700; line-height: 25px;}
.ic-win .settings .panes {flex: 1; min-height: 0; overflow-y: auto; padding: 16px 24px; display: flex; flex-direction: column;}
.ic-win .settings .pane {display: flex; flex-direction: column; gap: 12px;}
.ic-win .settings .pane.hidden {display: none;}
.ic-win .settings .row {height: 32px; display: flex; align-items: center; justify-content: space-between; gap: 12px;}
.ic-win .settings .item {display: flex; flex-direction: column; gap: 4px;}
.ic-win .settings .item > .label {height: 20px; line-height: 20px;}
.ic-win .settings select {width: 170px;}
.ic-win .settings .pair {display: flex; align-items: center; gap: 6px;}
.ic-win .settings #format.lossy {width: 100px;}
.ic-win .settings #quality {width: 64px; height: 32px;}
.ic-win .settings #quality.hidden {display: none;}
.ic-win .choice {display: flex; align-items: center; gap: 8px; min-height: 24px;}
.ic-win .formats {display: flex; flex-wrap: wrap; gap: 2px 16px;}
.ic-win .path-row {display: flex; align-items: center; gap: 6px;}
.ic-win .choice.path {flex: 1; min-width: 0;}
.ic-win .path-text {overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.ic-win .pick {width: 32px; height: 26px; flex-shrink: 0; padding: 0;}
.ic-win .settings .pane.about {flex: 1; min-height: 0;}
.ic-win .app-id {display: flex; align-items: center; gap: 14px;}
.ic-win .app-icon {width: 48px; height: 48px;}
.ic-win .app-name {font-size: 19px; font-weight: 700;}
.ic-win .link {color: var(--accent); cursor: pointer;}
.ic-win .link:hover {text-decoration: underline;}
.ic-win .notices {user-select: text; flex: 1; min-height: 80px; margin: 0; padding: 8px 10px; overflow: auto; border: 1px solid var(--border); border-radius: 4px; white-space: pre-wrap; font-family: inherit; font-size: 12px; line-height: 1.4; color: var(--text-muted);}
