:root{color-scheme:light;--bg-1: #eef3f8;--bg-2: #e3eaf2;--bg-3: #16202b;--card: #eef3f8;--card-2: #e8eef6;--text: #243447;--muted: #5c6b78;--accent: #2f6fce;--accent-soft: #d8e6ff;--warning: #c57a26;--danger: #c44747;--radius-lg: 22px;--radius-pill: 999px;--shadow-dark: rgba(149, 163, 178, .55);--shadow-light: rgba(255, 255, 255, .9);--dark-card: #1c2634;--dark-text: #eaf1ff;--dark-muted: #b7c3d6;--dark-shadow-dark: rgba(0, 0, 0, .55);--dark-shadow-light: rgba(255, 255, 255, .06)}*{box-sizing:border-box}body{margin:0;font-family:Manrope,Segoe UI,sans-serif;background:radial-gradient(circle at top,#f7fbff 0%,var(--bg-1) 48%,var(--bg-2) 72%),radial-gradient(circle at bottom right,#16202bf2,#16202b00 60%);color:var(--text)}#root{min-height:100vh;display:flex;flex-direction:column}.app{width:min(1200px,92vw);margin:12px auto 0;display:flex;flex-direction:column;gap:18px}@keyframes floatIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.topbar{gap:24px;padding:calc(12px + env(safe-area-inset-top,0px)) 16px 12px;border-radius:calc(var(--radius-lg) + 2px);background:linear-gradient(145deg,#202c3d,var(--dark-card));color:var(--dark-text);box-shadow:12px 12px 26px var(--dark-shadow-dark),-12px -12px 26px var(--dark-shadow-light);position:relative;z-index:20}.topbar-desktop{display:flex;justify-content:space-between;align-items:center;gap:24px}.topbar-compact{display:none;flex-direction:column;gap:10px}.topbar-row{display:flex;align-items:center;gap:10px}.topbar-row1 .title-wrap{flex:0 0 auto}.topbar-mode{flex:1 1 auto;text-align:center;font-weight:900;letter-spacing:.01em;color:var(--dark-muted);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.topbar-right{display:inline-flex;align-items:center;gap:10px;flex:0 0 auto}.topbar-row2{justify-content:space-between;gap:12px;flex-wrap:wrap;row-gap:10px}.topbar-row-tools,.segLabel{display:none}.topbar-tablet-actions{display:inline-flex;align-items:center;gap:10px}.topbar-phone-actions{display:none;align-items:center;gap:8px;flex:1 1 auto;justify-content:center;min-width:0}.phoneOnly{display:none}.tabletOnly{display:inline-flex}@media (max-width: 1024px){.topbar-desktop{display:none}.topbar-compact{display:flex}.topbar{padding-left:14px;padding-right:14px}.topbar-row2 .segmented .seg{padding:7px 10px}}@media (max-width: 480px){.topbar{padding-left:12px;padding-right:12px}.topbar-row{gap:8px}.topbar-row1{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px}.topbar-right{gap:8px}.topbar-mode,.topbar-tablet-actions,.topbar-row2{display:none}.topbar-phone-actions{display:inline-flex;justify-content:center;overflow:visible;padding:2px 0}.topbar-row-tools{display:flex;justify-content:center;width:100%}.topbar-row-tools .segmented-icons{flex:0 0 auto;background:transparent;box-shadow:none;gap:8px}.topbar-row-tools .segmented-icons .seg.is-active{width:auto;padding:0 16px;gap:8px}.topbar-row-tools .segmented-icons .seg.is-active .segLabel{display:inline;font-size:.78rem;font-weight:900;white-space:nowrap}.tabletOnly{display:none}.phoneOnly{display:inline-flex}.topbar-phone-actions .segmented{flex:1 1 auto;padding:0}.segmented-icons .seg{width:46px;height:46px;padding:0;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;background:linear-gradient(145deg,#202c3d,var(--dark-card));color:var(--dark-text);box-shadow:10px 10px 20px #0000008c,-10px -10px 20px #ffffff14}.segmented-icons .segIcon{width:18px;height:18px}.topbar-phone-actions .segmented.segmented-icons{background:transparent;box-shadow:none;padding:0;gap:10px}.topbar-phone-actions .segmented-icons .seg.is-active{background:linear-gradient(145deg,#2f6fce52,#2f6fce24);box-shadow:0 0 0 2px #2f6fce80,10px 10px 20px #0000008c,-10px -10px 20px #ffffff14}.topbar-phone-actions .icon-button.sm{width:46px;height:46px;padding:0;gap:0;justify-content:center;border-radius:999px;box-shadow:10px 10px 20px #0000008c,-10px -10px 20px #ffffff14}.topbar-phone-actions .icon-button.sm .icon{width:22px;height:22px}.topbar-row1 .logoWrap{margin-right:0}.topbar-row1 .topbarLogo{max-height:46px;transform:none}.topbar-phone-actions .icon-button:active,.topbar-phone-actions .segmented-icons .seg:active{box-shadow:inset 7px 7px 14px #0000008c,inset -7px -7px 14px #ffffff0f}.topbar-right .icon-button.sm{padding:8px 10px}}@media (max-width: 360px){.topbar-phone-actions .icon-button .label{display:none}}.title-wrap{display:flex;align-items:center;flex:0 0 auto}.title-wrap h1{margin:0;font-size:clamp(1.5rem,2vw,2.05rem);letter-spacing:-.02em;font-weight:900;color:var(--dark-text);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.logo-button{border:none;background:transparent;padding:0;display:inline-flex;align-items:center;cursor:pointer}.logoWrap{display:flex;align-items:center;margin-right:6px}.topbarLogo{display:block;height:auto;max-height:44px;width:auto;transform-origin:left center;transform:scale(1.18)}@media (max-width: 1023px){.topbarLogo{max-height:40px;transform:scale(1.12)}}@media (max-width: 639px){.topbarLogo{max-height:34px;transform:scale(1.08)}}.subtitle{margin:0;color:var(--dark-muted)}.action-bar{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap}.moreSheetOverlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:999;background:#0a0c1273;display:flex;align-items:flex-end;justify-content:center;padding:14px}.moreSheet{width:min(560px,100%);border-radius:22px;background:linear-gradient(145deg,#202c3d,var(--dark-card));color:var(--dark-text);box-shadow:18px 18px 38px #0000008c,-12px -12px 30px #ffffff14;padding:14px 14px calc(14px + env(safe-area-inset-bottom,0px))}.moreSheetHeader{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:2px 6px 10px}.moreSheetTitle{font-weight:900;letter-spacing:.01em}.moreSheetClose{width:40px;height:40px;border-radius:999px;border:none;cursor:pointer;background:#ffffff14;color:var(--dark-text);box-shadow:8px 8px 16px #00000073,-8px -8px 16px #ffffff0f;font-size:22px;line-height:1;display:inline-flex;align-items:center;justify-content:center}.moreSheetClose:active{box-shadow:inset 6px 6px 12px #0000008c,inset -6px -6px 12px #ffffff0f}.moreSheetList{display:grid;grid-template-columns:1fr;gap:10px}.moreSheetItem{border:none;width:100%;display:flex;align-items:center;gap:12px;padding:12px;border-radius:18px;cursor:pointer;text-align:left;background:#ffffff0f;color:var(--dark-text);box-shadow:9px 9px 18px #00000073,-9px -9px 18px #ffffff0f}.moreSheetItem:active{box-shadow:inset 6px 6px 12px #0000008c,inset -6px -6px 12px #ffffff0f}.moreSheetItem:disabled{opacity:.55;cursor:not-allowed}.moreSheetItemIcon{width:42px;height:42px;border-radius:16px;display:inline-flex;align-items:center;justify-content:center;background:#ffffff14;box-shadow:inset 6px 6px 12px #00000059,inset -6px -6px 12px #ffffff0d}.moreSheetItemIcon .icon{width:20px;height:20px}.moreSheetItemText{display:flex;flex-direction:column;gap:2px;min-width:0}.moreSheetItemLabel{font-weight:900;line-height:1.15}.moreSheetItemHint{font-size:.85rem;color:var(--dark-muted);line-height:1.15;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mini-title{font-weight:900;letter-spacing:.01em;font-size:.95rem}.neomorph-card{background:var(--card);border-radius:var(--radius-lg);padding:24px;box-shadow:14px 14px 30px var(--shadow-dark),-14px -14px 30px var(--shadow-light);position:relative;transition:transform .2s ease,box-shadow .2s ease;border:1px solid rgba(255,255,255,.55)}.neomorph-card:hover{transform:translateY(-1px)}.neo-button{border:none;background:var(--card);color:var(--text);padding:12px 22px;border-radius:var(--radius-pill);box-shadow:8px 8px 16px var(--shadow-dark),-8px -8px 16px var(--shadow-light);font-weight:600;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease,color .15s ease}.topbar .neo-button{background:linear-gradient(145deg,#202c3d,var(--dark-card));color:var(--dark-text);box-shadow:8px 8px 16px var(--dark-shadow-dark),-8px -8px 16px var(--dark-shadow-light)}.topbar .neo-button:hover{color:#fff}.topbar .neo-button:active{box-shadow:inset 6px 6px 12px #0000008c,inset -6px -6px 12px #ffffff0f}.neo-select{border:none;border-radius:16px;padding:10px 12px;background:#ffffff12;color:var(--dark-text);box-shadow:inset 6px 6px 12px #00000073,inset -6px -6px 12px #ffffff0d;font-weight:700;outline:none}.neo-select.light{background:#fffc;color:var(--text);box-shadow:inset 6px 6px 12px #95a3b273,inset -6px -6px 12px #ffffffd9}.neo-select:disabled{opacity:.6;cursor:not-allowed}.neo-button:hover{transform:translateY(-1px);color:var(--accent)}.neo-button:active{box-shadow:inset 6px 6px 12px var(--shadow-dark),inset -6px -6px 12px var(--shadow-light)}.icon-button{border:none;display:inline-flex;align-items:center;gap:10px;padding:10px 14px;border-radius:var(--radius-pill);background:var(--card);color:var(--text);box-shadow:9px 9px 18px var(--shadow-dark),-9px -9px 18px var(--shadow-light);cursor:pointer;font-weight:900;transition:transform .15s ease,box-shadow .15s ease;white-space:nowrap}.topbar .icon-button{background:linear-gradient(145deg,#202c3d,var(--dark-card));color:var(--dark-text);box-shadow:9px 9px 18px var(--dark-shadow-dark),-9px -9px 18px var(--dark-shadow-light)}.icon-button .icon{width:18px;height:18px;filter:drop-shadow(0 3px 6px rgba(0,0,0,.25))}.icon-button .label{font-size:.92rem}.icon-button.sm{padding:9px 12px;gap:8px}.icon-button.xs{padding:7px;gap:0;border-radius:12px;box-shadow:5px 5px 11px var(--shadow-dark),-5px -5px 11px var(--shadow-light)}.icon-button.xs .icon{width:15px;height:15px}.icon-button.primary{background:linear-gradient(145deg,#3a7ee6,#2a5eb8);color:#fff;box-shadow:9px 9px 18px #0d1c3759,-9px -9px 18px #ffffffa6}.icon-button.danger{color:var(--danger)}.icon-button.danger:hover:not(:disabled){background:linear-gradient(145deg,#d15f5f,#b23a3a);color:#fff}.topbar .icon-button.primary{box-shadow:9px 9px 18px #00000073,-9px -9px 18px #ffffff14}.icon-button:hover{transform:translateY(-1px)}.icon-button:active{transform:translateY(0);box-shadow:inset 6px 6px 12px #0000002e,inset -6px -6px 12px #fff9}.topbar .icon-button:active{box-shadow:inset 6px 6px 12px #0000008c,inset -6px -6px 12px #ffffff0f}.icon-button:disabled{opacity:.6;cursor:not-allowed;transform:none}.segmented{display:inline-flex;border-radius:var(--radius-pill);padding:6px;background:#ffffff12;box-shadow:inset 6px 6px 12px #00000073,inset -6px -6px 12px #ffffff0d}.segmented .seg{border:none;background:transparent;color:var(--dark-muted);padding:8px 12px;border-radius:var(--radius-pill);font-weight:900;cursor:pointer}.segmented .seg.is-active{background:#ffffff1f;color:var(--dark-text);box-shadow:6px 6px 12px #00000059,-6px -6px 12px #ffffff0f}.segmented .seg:disabled{opacity:.6;cursor:not-allowed}.neo-button.secondary{background:var(--accent-soft)}.neo-button.tiny{padding:6px 12px;font-size:.78rem}.neo-button.small{padding:8px 14px;font-size:.85rem}.neo-button.danger{color:var(--danger)}.neo-button:disabled{opacity:.6;cursor:not-allowed}.neo-button.is-active{color:var(--accent)}.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.section-header h2,.section-header h3{margin:0}.section-header h2{font-size:1.15rem;letter-spacing:-.01em}.section-header h3{font-size:1.05rem;letter-spacing:-.01em}.value-pill{padding:6px 12px;border-radius:var(--radius-pill);background:var(--accent-soft);font-weight:600}.layout{display:grid;grid-template-columns:var(--sidebar-w, 208px) 1fr;gap:24px;align-items:start;position:relative;z-index:1;margin-top:2px}.under-preview{display:grid;grid-template-columns:minmax(240px,320px) 1fr;gap:18px;align-items:stretch}.under-preview>.neomorph-card{height:100%}.neomorph-card.compact{padding:16px}.main-content{display:flex;flex-direction:column;gap:24px}.main-content>*{animation:floatIn .6s ease both}.main-content>*:nth-child(1){animation-delay:.05s}.main-content>*:nth-child(2){animation-delay:.12s}.main-content>*:nth-child(3){animation-delay:.18s}.main-content>*:nth-child(4){animation-delay:.24s}.sidebar{position:sticky;top:8px;align-self:start;height:fit-content;min-width:0}.thumb-resize{position:absolute;top:0;bottom:0;right:-19px;width:14px;padding:0;border:none;background:transparent;cursor:ew-resize;touch-action:none;display:grid;place-items:center;z-index:3}.thumb-resize:before{content:"";position:absolute;top:10%;bottom:10%;left:50%;width:3px;transform:translate(-50%);border-radius:var(--radius-pill);background:#24344724;transition:background .15s ease}.thumb-resize:hover:before,.thumb-resize:focus-visible:before,.thumb-resize.is-dragging:before{background:var(--accent)}.thumb-resize .grip-knob{position:relative;z-index:1;width:10px;height:38px;border-radius:var(--radius-pill);background:var(--card);border:1px solid rgba(255,255,255,.6);box-shadow:4px 4px 10px var(--shadow-dark),-4px -4px 10px var(--shadow-light);transition:border-color .15s ease}.thumb-resize:hover .grip-knob,.thumb-resize.is-dragging .grip-knob{border-color:var(--accent)}.thumb-resize:focus-visible{outline:2px solid var(--accent);outline-offset:1px;border-radius:var(--radius-pill)}body.is-resizing{-webkit-user-select:none;user-select:none;cursor:ew-resize}body.is-resizing .neomorph-card:hover{transform:none}.layout.is-sidebar-collapsed{grid-template-columns:0 1fr}.layout.is-sidebar-hidden{grid-template-columns:1fr}.layout.is-sidebar-hidden .sidebar,.layout.is-sidebar-collapsed .thumb-panel{display:none}.layout.is-sidebar-collapsed .sidebar{min-height:160px}.layout.is-sidebar-collapsed .thumb-resize{right:auto;left:0;width:34px;cursor:pointer}.thumb-resize .grip-open-icon{position:relative;z-index:1;width:20px;height:20px;padding:6px;box-sizing:content-box;border-radius:12px;background:var(--card);color:var(--accent);box-shadow:5px 5px 12px var(--shadow-dark),-5px -5px 12px var(--shadow-light)}.file-drop{display:flex;flex-direction:column;gap:18px}.file-drop.has-file{gap:14px}.file-drop.has-file .drop-zone{padding:12px}.file-drop.has-file .drop-row{flex-direction:row;justify-content:space-between;align-items:center;text-align:left}.file-drop.has-file .mini-title{font-size:.92rem}.file-drop.has-file .drop-content{padding:0}.drop-row{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center}.drop-zone{border-radius:var(--radius-lg);padding:20px;background:linear-gradient(145deg,var(--card),var(--card-2));box-shadow:inset 6px 6px 12px var(--shadow-dark),inset -6px -6px 12px var(--shadow-light);text-align:center;transition:border-color .2s ease,box-shadow .2s ease}.drop-zone.is-dragging{box-shadow:inset 6px 6px 12px var(--accent-soft),inset -6px -6px 12px var(--shadow-light)}.drop-content h2{margin-top:0}.file-meta{display:flex;flex-direction:column;gap:8px}.file-bottom{display:flex;align-items:center;justify-content:space-between;gap:16px}.file-bottom .file-meta{flex:1 1 auto;min-width:0}.file-details{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:12px}.file-details .label{display:block;font-size:.75rem;color:var(--muted)}.warning{color:var(--warning);font-weight:600}.error{color:var(--danger);font-weight:600}.file-actions{display:flex;align-items:center;justify-content:flex-end}.help-panel{max-height:0;padding:0 18px;opacity:0;overflow:hidden;transition:max-height .25s ease,opacity .25s ease,padding .25s ease}.help-panel.is-open{max-height:180px;padding:14px 18px;opacity:1}.help-title{font-weight:900;color:var(--muted);margin-bottom:10px}.help-steps{margin:0;padding-left:18px;color:var(--muted)}.preview-card{display:flex;flex-direction:column;gap:16px;padding-top:16px}.preview-canvas{position:relative;min-height:320px;height:min(74vh,760px);display:flex;justify-content:center;align-items:center;background:linear-gradient(145deg,var(--card),var(--card-2));border-radius:16px;box-shadow:inset 6px 6px 12px #95a3b259,inset -6px -6px 12px #ffffffd9;overflow:hidden}.preview-stage{position:relative;display:inline-block}.preview-canvas canvas{max-width:100%;border-radius:12px;box-shadow:10px 10px 22px #78859659}.preview-placeholder{color:var(--muted);padding:32px;text-align:center}.split-line{position:absolute;top:0;width:2px;background:var(--accent);transform:translate(-1px)}.split-handle{position:absolute;top:50%;left:50%;width:26px;height:26px;border-radius:50%;background:var(--card);box-shadow:4px 4px 10px var(--shadow-dark),-4px -4px 10px var(--shadow-light);transform:translate(-50%,-50%);cursor:ew-resize}.split-controls{display:flex;flex-direction:column;gap:16px}.split-controls.compact .section-header{margin-bottom:12px}.split-controls.compact{gap:12px}.slider-wrap input[type=range]{width:100%;accent-color:var(--accent)}.preset-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}.output-card{display:flex;flex-direction:column;gap:16px}.output-card.compact .section-header{margin-bottom:12px}.output-card.compact{gap:12px}.output-card.compact .output-actions{gap:10px}.output-card.compact .neo-button{padding:10px 18px}.output-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center}.toggle{display:flex;align-items:center;gap:10px;font-weight:600}.toggle input{width:18px;height:18px}.switch{display:inline-flex;align-items:center;gap:10px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.switch input{position:absolute;opacity:0;pointer-events:none}.switch-ui{width:46px;height:26px;border-radius:999px;background:#ffffffa6;box-shadow:inset 6px 6px 12px #95a3b259,inset -6px -6px 12px #ffffffd9;position:relative;flex:0 0 auto}.switch-ui:after{content:"";position:absolute;top:4px;left:4px;width:18px;height:18px;border-radius:50%;background:linear-gradient(145deg,var(--card),var(--card-2));box-shadow:6px 6px 12px #95a3b259,-6px -6px 12px #ffffffd9;transition:transform .18s ease}.switch input:checked+.switch-ui{background:#2f6fce38}.switch input:checked+.switch-ui:after{transform:translate(20px)}.switch-label{font-weight:900;color:var(--muted);font-size:.95rem}.thumb-panel{display:flex;flex-direction:column;gap:14px;max-height:calc(100vh - 120px);overflow:hidden;min-width:0}.thumb-panel-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-bottom:10px;border-bottom:1px solid rgba(36,52,71,.1);min-width:0}.thumb-panel-head .thumb-count{font-size:.82rem;font-weight:700;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.thumb-list{display:flex;flex-direction:column;gap:12px;flex:1 1 auto;overflow-y:auto;padding:8px 8px 14px 2px;container-type:inline-size}.thumb-list.is-output{gap:6px;padding:4px 8px 10px 2px}.thumb-list::-webkit-scrollbar{width:10px}.thumb-list::-webkit-scrollbar-track{background:#ffffff40;border-radius:999px;box-shadow:inset 4px 4px 10px #95a3b240,inset -4px -4px 10px #ffffffbf}.thumb-list::-webkit-scrollbar-thumb{background:#24344752;border-radius:999px;border:2px solid rgba(255,255,255,.35)}.thumb-list::-webkit-scrollbar-thumb:hover{background:#2434476b}.thumb-item{position:relative;padding:12px;border-radius:16px;background:linear-gradient(145deg,var(--card),var(--card-2));box-shadow:inset 4px 4px 8px var(--shadow-dark),inset -4px -4px 8px var(--shadow-light);display:flex;flex-direction:column;gap:10px;cursor:default;border:1px solid rgba(255,255,255,.45)}.thumb-item-button,.thumb-select{-moz-appearance:none;appearance:none;-webkit-appearance:none;background:transparent;border:none;padding:0;font:inherit;color:inherit;text-align:inherit}.thumb-item-button{cursor:pointer}.thumb-select{width:100%;display:flex;flex-direction:column;gap:10px;cursor:pointer}.thumb-select:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:12px}.thumb-list.is-output .thumb-item{padding:0;gap:6px;align-items:center;background:transparent;border:none;box-shadow:none;position:relative;cursor:default}.thumb-list.is-output .thumb-select{gap:6px;align-items:center;cursor:grab}.thumb-list.is-output .thumb-item.is-dragging,.thumb-list.is-output .thumb-item.is-dragging .thumb-select{cursor:grabbing}.thumb-list.is-output .thumb-label{font-size:.9rem;text-align:center;color:var(--muted);order:2}.thumb-list.is-output .thumb-canvas{order:1;justify-content:center}.thumb-list.is-output .thumb-canvas canvas{background:#fff;border-radius:6px;border:1px solid rgba(36,52,71,.18);box-shadow:none}.thumb-list.is-output .thumb-item.is-selected{outline:none}.thumb-list.is-output .thumb-item.is-selected .thumb-canvas canvas{border-color:var(--accent);box-shadow:0 0 0 2px #2f6fce59,10px 10px 18px #78859640}.thumb-item .thumb-label{font-size:1rem}.thumb-item canvas{border-radius:12px}.thumb-actions{position:absolute;top:8px;right:8px;z-index:2;display:flex;justify-content:flex-end;opacity:.55;transform:scale(.94);transition:opacity .15s ease,transform .15s ease}.thumb-item:hover>.thumb-actions,.thumb-item:focus-within>.thumb-actions{opacity:1;transform:scale(1)}.thumb-item.is-dragging>.thumb-actions{opacity:0;pointer-events:none}.thumb-list.is-output .thumb-item{width:max-content;min-width:96px;max-width:100%;align-self:center}.thumb-list.is-output .thumb-select{width:auto}.thumb-list.is-output .thumb-actions{top:4px;right:4px}.thumb-item.is-selected{outline:2px solid var(--accent)}.thumb-label{font-weight:700;color:var(--accent)}.thumb-canvas{display:flex;justify-content:center;align-items:center;width:100%}.thumb-canvas canvas{max-width:100%;max-height:100%}.thumb-list.is-output{--thumb-w: calc(var(--sidebar-w, 208px) - 68px)}.thumb-list.is-output .thumb-canvas{height:calc(var(--thumb-w) * 1.25)}.thumb-list.is-output .thumb-canvas{overflow:visible;border-radius:12px}.thumb-placeholder{color:var(--muted);font-size:.85rem;padding:12px 0}@container (max-width: 158px){.thumb-item{padding:6px;gap:3px;border-radius:12px}.thumb-item .thumb-label{font-size:.72rem;line-height:1.25}.thumb-actions{top:3px;right:3px}.thumb-actions .icon-button.xs{padding:5px;border-radius:9px}.thumb-actions .icon-button.xs .icon{width:13px;height:13px}}.progress-toast{position:fixed;right:24px;bottom:24px;background:linear-gradient(145deg,#202c3d,var(--dark-card));border-radius:18px;padding:16px 18px;box-shadow:12px 12px 24px var(--dark-shadow-dark),-12px -12px 24px var(--dark-shadow-light);min-width:260px;z-index:20;color:var(--dark-text)}.progress-toast.is-done{border:1px solid var(--accent)}.toast-content strong{display:block;margin-bottom:4px}.toast-content p{margin:0 0 8px;color:var(--dark-muted)}.toast-progress{background:#ffffff1f;height:8px;border-radius:999px;overflow:hidden}.toast-progress-bar{height:100%;background:var(--accent);transition:width .2s ease}.toast-action{margin-top:10px;width:100%;border:1px solid rgba(255,255,255,.16);background:#ffffff1a;color:var(--dark-text);font:inherit;font-weight:900;font-size:.85rem;padding:8px 14px;border-radius:var(--radius-pill);cursor:pointer;transition:background .15s ease}.toast-action:hover{background:#ffffff2e}.toast-action:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.footer{margin-top:auto;padding:24px 0 32px}.footer-card{width:min(1200px,92vw);margin:0 auto;display:flex;justify-content:space-between;align-items:center;gap:12px;background:linear-gradient(145deg,#202c3d,var(--dark-card));border-radius:var(--radius-lg);padding:18px 24px;box-shadow:12px 12px 24px var(--dark-shadow-dark),-12px -12px 24px var(--dark-shadow-light);font-weight:600;color:var(--dark-text)}.muted{color:var(--muted)}@media (max-width: 980px){.layout,.layout.is-sidebar-collapsed{grid-template-columns:1fr;--sidebar-w: 178px}.under-preview{grid-template-columns:1fr}.sidebar{position:static}.layout.is-sidebar-collapsed .thumb-panel{display:flex}.layout.is-sidebar-collapsed .sidebar{min-height:0}.thumb-resize{display:none}.thumb-panel{max-height:min(46vh,420px)}.footer-card{flex-direction:column;align-items:flex-start}}@media (max-width: 640px){.topbar{flex-direction:column;align-items:flex-start}.file-actions{justify-content:flex-start}.output-actions{flex-direction:column;align-items:stretch}}.under-preview.is-hidden{display:none}.tool-switch{flex:0 0 auto}.scan-workspace{display:flex;flex-direction:column;gap:24px;min-width:0}.scan-workspace>*,.scan-grid>*,.scan-side>*,.scan-preview-card>*,.scan-export-card>*{min-width:0}.scan-grid{display:grid;grid-template-columns:1fr minmax(300px,360px);gap:24px;align-items:start;min-width:0}.scan-side{display:flex;flex-direction:column;gap:18px;min-width:0}.scan-preview-card{display:flex;flex-direction:column;gap:14px}.scan-preview-meta{font-size:.82rem;text-align:right}.scan-preview-toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;min-width:0}.scan-preview-card .section-header{flex-wrap:wrap;gap:8px}.scan-header-icon{width:18px;height:18px;color:var(--muted)}.scan-stage,.scan-stage-empty{position:relative;min-height:300px;height:min(62vh,640px);display:flex;align-items:center;justify-content:center;background:linear-gradient(145deg,var(--card),var(--card-2));border-radius:16px;box-shadow:inset 6px 6px 12px #95a3b259,inset -6px -6px 12px #ffffffd9;overflow:hidden}.scan-stage-empty{color:var(--muted);padding:32px;text-align:center}.scan-stage-inner{position:relative;display:inline-block;min-width:0;max-width:100%;max-height:100%;line-height:0;box-shadow:10px 10px 22px #78859659;border-radius:10px;overflow:hidden}.scan-canvas{display:block;max-width:100%;max-height:min(62vh,640px);width:auto;height:auto}.scan-canvas-clip{position:absolute;inset:0 auto 0 0;width:50%;overflow:hidden}.scan-canvas-clip .scan-canvas-original{max-height:min(62vh,640px)}.scan-compare-handle{position:absolute;top:0;bottom:0;left:50%;width:34px;margin-left:-17px;cursor:ew-resize;display:flex;align-items:center;justify-content:center;touch-action:none;background:transparent;border:none}.scan-compare-handle:before{content:"";position:absolute;top:0;bottom:0;left:50%;width:2px;margin-left:-1px;background:var(--accent)}.scan-compare-grip{width:26px;height:26px;border-radius:var(--radius-pill);background:var(--card);box-shadow:4px 4px 10px var(--shadow-dark),-4px -4px 10px var(--shadow-light);position:relative}.scan-compare-handle:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:12px}.scan-compare-handle.is-dragging .scan-compare-grip{box-shadow:inset 4px 4px 8px #0000002e,inset -4px -4px 8px #fff9}.scan-stage-tag{position:absolute;top:10px;padding:4px 10px;border-radius:var(--radius-pill);font-size:.72rem;font-weight:900;background:#202c3db8;color:var(--dark-text);pointer-events:none}.scan-stage-tag-left{left:10px}.scan-stage-tag-right{right:10px}.scan-stage.is-loading .scan-stage-inner{opacity:.72;transition:opacity .2s ease}.scan-stage-spinner{position:absolute;width:26px;height:26px;border-radius:var(--radius-pill);border:3px solid var(--accent-soft);border-top-color:var(--accent);animation:scanSpin .9s linear infinite}@keyframes scanSpin{to{transform:rotate(360deg)}}.scan-error{margin:0;color:var(--danger);font-weight:600;display:flex;align-items:center;gap:10px;flex-wrap:wrap}.scan-preset-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.scan-preset-card{position:relative;display:flex;align-items:center;gap:10px;padding:10px;border:none;border-radius:16px;background:var(--card);color:var(--text);text-align:left;cursor:pointer;box-shadow:6px 6px 14px var(--shadow-dark),-6px -6px 14px var(--shadow-light);transition:transform .15s ease,box-shadow .15s ease}.scan-preset-card:hover{transform:translateY(-1px)}.scan-preset-card:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.scan-preset-card.is-selected{box-shadow:inset 5px 5px 10px #00000024,inset -5px -5px 10px #ffffffb3;color:var(--accent)}.scan-preset-thumb{flex:0 0 auto;width:34px;height:46px;border-radius:6px;overflow:hidden;background:linear-gradient(145deg,var(--card-2),var(--card));box-shadow:inset 2px 2px 5px #95a3b273,inset -2px -2px 5px #fffc;display:flex;align-items:center;justify-content:center}.scan-preset-thumb canvas{width:100%;height:100%;object-fit:cover;display:block}.scan-preset-thumb-empty{width:100%;height:100%}.scan-preset-text{display:flex;flex-direction:column;gap:2px;min-width:0}.scan-preset-name{font-weight:900;font-size:.84rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.scan-preset-desc{font-size:.72rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.scan-preset-badge{position:absolute;top:6px;right:6px;padding:2px 7px;border-radius:var(--radius-pill);background:var(--accent-soft);color:var(--accent);font-size:.62rem;font-weight:900}.scan-advanced-toggles{display:inline-flex;gap:6px}.scan-advanced{display:flex;flex-direction:column;gap:12px}.scan-advanced-note{margin:0}.scan-slider{display:flex;flex-direction:column;gap:4px}.scan-slider-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px}.scan-slider-head label{font-size:.82rem;font-weight:600}.scan-slider-value{font-size:.76rem;font-weight:900;color:var(--muted);font-variant-numeric:tabular-nums}.scan-slider input[type=range]{width:100%;accent-color:var(--accent)}.scan-advanced-actions{display:flex;justify-content:flex-start;padding-top:4px}.scan-export-card{display:flex;flex-direction:column;gap:16px}.scan-field{display:flex;flex-direction:column;gap:8px}.scan-field-label{font-size:.82rem;font-weight:900;color:var(--muted)}.scan-segmented{background:linear-gradient(145deg,var(--card-2),var(--card));box-shadow:inset 5px 5px 10px #95a3b266,inset -5px -5px 10px #ffffffd9;flex-wrap:wrap}.scan-segmented .seg{color:var(--muted);font-size:.82rem}.scan-segmented .seg.is-active{background:var(--card);color:var(--accent);box-shadow:4px 4px 9px var(--shadow-dark),-4px -4px 9px var(--shadow-light)}.scan-segmented .seg:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.scan-apply-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.scan-dirty-hint{font-size:.76rem;color:var(--warning)}.scan-quality-hint,.scan-privacy,.scan-format-note,.scan-progress{margin:0;font-size:.78rem}.scan-progress{min-height:1.2em;font-weight:600}.scan-warning{margin:0;font-size:.78rem;color:var(--warning)}.scan-export-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.scan-sheet-body{padding:4px 4px 12px;display:flex;flex-direction:column;gap:14px}.scan-sheet-preset{display:flex;align-items:center;gap:8px;font-weight:900;color:var(--dark-text)}.scan-sheet-preset .icon{width:18px;height:18px}.moreSheetContent{color:var(--dark-text);max-height:62vh;overflow-y:auto}.moreSheetContent .scan-slider-head label,.moreSheetContent .scan-slider-value{color:var(--dark-text)}@media (prefers-reduced-motion: reduce){.scan-stage-spinner{animation:none}}@media (max-width: 980px){.scan-grid{grid-template-columns:1fr}.scan-preset-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}}@media (max-width: 640px){.scan-stage,.scan-stage-empty{height:min(52vh,460px)}.scan-preset-grid{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px;-webkit-overflow-scrolling:touch}.scan-preset-card{flex:0 0 auto;width:178px;scroll-snap-align:start}.scan-export-actions{flex-direction:column;align-items:stretch}}.compress-workspace{display:flex;flex-direction:column;gap:16px;min-width:0}.compress-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,360px);gap:16px;align-items:start;min-width:0}.compress-workspace>*,.compress-grid>*,.compress-side>*,.compress-level-grid>*,.compress-result>*{min-width:0}.compress-side{display:flex;flex-direction:column;gap:16px;min-width:0}.compress-preview-card{display:flex;flex-direction:column;gap:12px;min-width:0}.compress-preview-meta{font-size:.82rem;color:var(--muted);font-weight:700}.compress-level-grid{display:flex;flex-direction:column;gap:12px}.compress-level-card{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:14px 16px;border:none;border-radius:18px;background:var(--card);color:var(--text);text-align:left;cursor:pointer;box-shadow:7px 7px 16px var(--shadow-dark),-7px -7px 16px var(--shadow-light);transition:transform .15s ease,box-shadow .15s ease,color .15s ease}.compress-level-card:hover:not(:disabled){transform:translateY(-1px)}.compress-level-card:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.compress-level-card:disabled{opacity:.55;cursor:not-allowed}.compress-level-card.is-selected{color:var(--accent);box-shadow:inset 5px 5px 11px #00000024,inset -5px -5px 11px #ffffffb3}.compress-level-text{display:flex;flex-direction:column;gap:3px;min-width:0}.compress-level-name{display:flex;align-items:center;gap:8px;font-weight:900;font-size:.98rem;letter-spacing:-.01em}.compress-level-hint{font-size:.82rem;color:var(--muted);font-weight:600}.compress-level-badge{font-size:.66rem;font-weight:900;text-transform:uppercase;letter-spacing:.04em;color:var(--accent);background:var(--accent-soft);border-radius:var(--radius-pill);padding:3px 8px}.compress-level-check{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;flex:0 0 auto;border-radius:999px;color:var(--accent)}.compress-level-card.is-selected .compress-level-check{box-shadow:inset 3px 3px 6px #0000001f,inset -3px -3px 6px #ffffffbf}.compress-actions{display:flex;align-items:center;gap:10px;margin-top:14px;flex-wrap:wrap}.compress-progress{margin:8px 0 0;font-size:.82rem;min-height:1.2em}.compress-result{margin-top:12px;padding:14px;border-radius:16px;background:linear-gradient(145deg,var(--card-2),var(--card));box-shadow:inset 5px 5px 11px #95a3b259,inset -5px -5px 11px #ffffffd9}.compress-result-headline{margin:0;display:flex;align-items:center;flex-wrap:wrap;gap:8px;font-weight:900;font-size:1rem}.compress-result-from{color:var(--muted);text-decoration:line-through}.compress-result-arrow{color:var(--muted)}.compress-result-to{color:var(--accent);font-size:1.15rem}.compress-result-percent{font-size:.72rem;font-weight:900;text-transform:uppercase;letter-spacing:.03em;color:#fff;background:var(--accent);border-radius:var(--radius-pill);padding:4px 10px}.compress-result.is-unchanged .compress-result-headline{color:var(--warning);font-size:.95rem}.compress-bar{margin:12px 0 10px;height:10px;border-radius:var(--radius-pill);background:var(--card);box-shadow:inset 3px 3px 7px #95a3b273,inset -3px -3px 7px #ffffffd9;overflow:hidden}.compress-bar-fill{display:block;height:100%;border-radius:var(--radius-pill);background:linear-gradient(90deg,var(--accent),#5f97e6);transition:width .35s ease}.compress-result-detail{margin:0;font-size:.8rem}.compress-result-actions{margin-top:12px;display:flex;gap:10px}.compress-note,.compress-privacy{margin:10px 0 0;font-size:.78rem;line-height:1.45}.compress-privacy{opacity:.85}@media (prefers-reduced-motion: reduce){.compress-bar-fill,.compress-level-card{transition:none}}@media (max-width: 980px){.compress-grid{grid-template-columns:minmax(0,1fr)}}@media (max-width: 640px){.compress-result-actions,.compress-actions{flex-direction:column;align-items:stretch}}.compress-preview-meta{display:inline-flex;align-items:center;gap:8px;font-size:.82rem;color:var(--muted);font-weight:700}.compress-page-step{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;padding:0;border:none;border-radius:999px;background:var(--card);color:var(--text);cursor:pointer;box-shadow:3px 3px 7px var(--shadow-dark),-3px -3px 7px var(--shadow-light)}.compress-page-step:active:not(:disabled){box-shadow:inset 2px 2px 5px var(--shadow-dark),inset -2px -2px 5px var(--shadow-light)}.compress-page-step:disabled{opacity:.4;cursor:not-allowed;box-shadow:none}.compress-page-step .icon{width:15px;height:15px}.compress-target{margin-top:12px}.compress-target-label{display:block;font-size:.82rem;font-weight:800;color:var(--muted);margin-bottom:8px}.compress-target-row{display:flex;align-items:center;gap:10px}.compress-target-input{flex:1 1 auto;min-width:0;padding:12px 14px;font:inherit;font-weight:900;font-size:1.05rem;color:var(--text);border:none;border-radius:14px;background:var(--card);box-shadow:inset 4px 4px 9px var(--shadow-dark),inset -4px -4px 9px var(--shadow-light)}.compress-target-input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.compress-target-unit{font-weight:900;color:var(--muted);flex:0 0 auto}.compress-result-missed{color:var(--warning)}