.layout{width:100vw;height:100vh;background:#fff;margin:0 auto;box-sizing:border-box}.layout__container{width:100%;height:100%;padding:8px;position:relative;left:50%;top:50%;transform:translate(-50%,-50%);overflow:hidden}.layout__container--inner{width:100%;height:100%;background:#fff;border-radius:8px;overflow:hidden;box-shadow:1px 1px 10px #1e1e1e}.layout__body{width:100%;height:calc(100% - 30px);display:flex;flex-direction:row;background:#1e1e1e;overflow:hidden}.image-tool__input{min-width:360px;padding-left:20px}@media screen and (min-width: 960px){.layout__container{width:800px;height:450px;padding:8px}.layout__container--inner{border-radius:8px}.layout__header-title{max-width:100%}.layout__body{display:flex;flex-wrap:nowrap;flex-direction:row;align-items:start}.image-tool__body{display:flex;flex-wrap:wrap;flex-direction:row}.image-tool__output{flex:1;padding-right:20px;height:100%}.image-tool__preview{height:100%}.image-tool__preview-group{width:50%;height:100%}.image-tool__preview-group h3{text-align:center;height:30px;margin:10px 0}.image-tool__list{height:calc(100% - 60px);overflow-y:auto}.image-tool__preview{flex-direction:row}}@media screen and (min-width: 1024px){.layout__container{width:960px;height:480px}}@media screen and (min-width: 1280px){.layout__container{width:1200px;height:600px}}@media screen and (min-width: 1366px){.layout__container{width:1280px;height:640px}}@media screen and (min-width: 1536px){.layout__container{width:1366px;height:678px}}@media screen and (min-width: 1600px){.layout__container{width:1440px;height:720px}}@media screen and (min-width: 1920px){.layout__container{width:1600px;height:800px}}@media screen and (min-width: 2560px){.layout__container{width:2000px;height:900px}}@media screen and (min-width: 3840px){.layout__container{width:3000px;height:1200px}}.layout__header{width:100%;height:30px;display:flex;align-items:center;justify-content:flex-start;padding:0 12px;box-sizing:border-box;background:#1e1e1e}.layout__header-right{flex:1;display:flex;justify-content:center}.layout__header-title{display:inline-block;font-size:14px;font-weight:400;color:#ccc;text-align:center;padding:0 16px;border-radius:8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.layout__dots{display:flex;gap:8px;margin:0}.layout__dot{width:12px;height:12px;border-radius:50%}.layout__dot--red{background:#ff5f56}.layout__dot--yellow{background:#ffbd2e}.layout__dot--green{background:#27c93f}.layout__sidebar{width:150px;background:#23272e;display:flex;flex-direction:column;align-items:flex-start;border-top-left-radius:0;border-bottom-left-radius:10px;box-shadow:2px 0 12px #00000026}.layout__nav{display:flex;flex-direction:column;width:100%;gap:4px}.layout__nav-link{color:#d4d4d4;text-decoration:none;padding:4px 8px;border-radius:6px 0 0 6px;font-size:14px;transition:background .2s,color .2s}.layout__nav-link--active,.layout__nav-link:hover{background:#333337;color:#fff}.image-tool{box-sizing:border-box;margin:0 auto;color:#fff;width:100%;height:100%}.image-tool__title{color:#fff;text-align:center;font-size:2rem;font-weight:600;line-height:1}.image-tool__body{box-sizing:border-box;width:100%;height:100%;display:flex;gap:20px;padding-top:20px}.image-tool__button{background:#2196f3;color:#fff;border:none;padding:10px 20px;border-radius:4px;cursor:pointer;font-size:1em;transition:background .3s ease;width:100%;margin-top:20px}.image-tool__button:hover{background:#1976d2}.image-tool__status{text-align:center;margin-top:10px;color:#64b5f6}.image-tool__error{color:#ff8a80;text-align:center;margin:10px 0;padding:10px;background-color:#f443361a;border-radius:4px}.image-tool__content{flex:1;display:flex;flex-direction:column;gap:20px}.image-tool__preview{display:flex;gap:16px}.process-node-destination{display:flex;flex-direction:row;align-items:center;gap:20px;padding:0 15px;border-radius:8px;background-color:#272727;height:70px;width:100%;box-sizing:border-box;margin-bottom:10px}.destination-image-container{height:45px;width:80px;flex-shrink:0}.process-node-destination img{width:100%;height:100%;object-fit:cover;border-radius:4px}.process-node-destination__file-info{width:200px;color:#fff;font-size:.9em;flex-grow:1;gap:15px}.process-node-destination__file-info p{margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#ccc}.process-node-destination .file-info__label{margin-right:4px;opacity:.7}.process-node-destination__button-group{display:flex;gap:8px;flex-shrink:0}.process-node-destination__link{color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:.9em;transition:background-color .3s ease;text-decoration:none;white-space:nowrap}.process-node-destination__link:hover{color:#0ff}.process-node-destination__link+.process-node-destination__link{margin-left:8px}button.process-node-destination__link,.process-node-destination__link button{border:none}.image-scale__controls{background-color:#272727;margin-top:20px;padding:20px;border-radius:8px;color:#fff}.image-scale__radio{color:#fff}.process-node-source__upload{color:#fff;border:2px dashed #666;border-radius:8px;padding:20px;text-align:center;cursor:pointer;transition:all .3s ease}.process-node-source__upload:hover{border-color:#999}.process-node-source__upload{border-color:#2196f3;background-color:#2196f31a}.image-converter__options{background-color:#272727;margin-top:20px;padding:20px;border-radius:8px;display:flex;flex-direction:column;gap:20px}.image-converter__quality{display:flex;align-items:center;gap:8px}.image-converter__quality label{white-space:nowrap}.image-converter__quality span{line-height:24px}.image-converter__select{margin-left:4px}.mac-dots{display:flex;gap:8px;margin-right:16px}.mac-dot{width:12px;height:12px;border-radius:50%;display:inline-block}.mac-dot.red{background:#ff5f56}.mac-dot.yellow{background:#ffbd2e}.mac-dot.green{background:#27c93f}.page-title{font-size:2rem;font-weight:700;color:#fff;line-height:1}.tools-grid{display:flex;gap:24px}.tool-card{background:#252526;border-radius:8px;padding:24px 20px;color:#d4d4d4;text-decoration:none;box-shadow:0 2px 8px #0003;transition:background .2s}.tool-card:hover{background:#333337}.home-welcome{text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center}.home-description{font-size:1.2rem;color:#bdbdbd;margin-top:24px;text-align:center}html,body{margin:0;padding:0;height:100vh}body{margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}::-webkit-scrollbar{width:14px;height:14px}::-webkit-scrollbar-thumb{background-color:#424242;border-radius:7px;border:3px solid transparent;background-clip:padding-box}::-webkit-scrollbar-thumb:hover{background-color:#505050}::-webkit-scrollbar-track{background-color:transparent}::-webkit-scrollbar-corner{background-color:transparent}.ml-1x{margin-left:2px}.ml-2x{margin-left:4px}.mr-1x{margin-right:2px}.mr-2x{margin-right:4px}.g-desc{color:#ccc;font-size:12px;text-align:right;padding-right:16px}.g-divider{margin:4px 0;width:100%;height:1px;background-color:#606060}.g-menu{width:100%;height:100%;background-color:#373737;border-left:1px solid #373737}.g-menu.first-level{background-color:#373737;border-left:1px solid #373737}.g-menu.second-level{background-color:#272727;border-left:1px solid #272727}.g-menu.third-level{background-color:#1f1f1f;border-left:1px solid #1f1f1f}.g-menu-item{height:24px;padding-left:8px;color:#ccc;font-size:14px;line-height:24px;text-align:left;border:1px solid transparent;box-sizing:border-box;cursor:pointer;white-space:nowrap;text-decoration:none}.g-menu-item:hover,.g-menu-item.is-active{color:#fff;background-color:#424242}.g-menu-item.is-active:focus{background-color:#75715e;border-color:#99947c}