:root{color:#18202a;background:#f5f7fb;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.55}.app-shell{min-height:100vh}.topbar{align-items:center;background:#fff;border-bottom:1px solid #dbe3ec;display:flex;gap:24px;justify-content:space-between;min-height:68px;padding:0 28px}.brand,.topbar nav{align-items:center;display:flex;gap:12px}.topbar nav{flex-wrap:wrap}.brand,.topbar a{color:#1f2933;font-weight:800;text-decoration:none}.brand svg,.tool-card svg,.page-title svg,.dropzone svg,.photo-drop svg,.icon-button svg,.primary-button svg,.status-heading svg,.download-button svg,.shape-actions svg{height:20px;width:20px}.page{margin:0 auto;max-width:1180px;padding:34px 24px 56px}.page-title{align-items:center;display:flex;gap:14px;margin-bottom:22px}.page-title h1{font-size:34px;margin:0}.page-title p,.tool-card p,.file-row span:last-child,.result-list span,.status-card p{color:#667085}.tool-grid{display:grid;gap:14px;grid-template-columns:repeat(4,minmax(0,1fr))}.tool-grid.compact{grid-template-columns:repeat(3,minmax(0,1fr))}.tool-card{align-items:start;background:#fff;border:1px solid #d7dee8;border-radius:8px;color:#18202a;display:grid;gap:10px;min-height:180px;padding:18px;text-decoration:none}.tool-grid.compact .tool-card{min-height:150px}.tool-card strong{font-size:18px}.tool-card.active:hover{border-color:#12636f;box-shadow:0 12px 28px #12636f1f}.tool-card.disabled{background:#f0f3f7;color:#6b7280;cursor:default}.tool-layout{display:grid;gap:20px;grid-template-columns:minmax(0,1fr) 320px}.panel{background:#fff;border:1px solid #d7dee8;border-radius:8px;padding:20px}.options{display:grid;gap:14px}.bulk-layout{align-items:start;display:grid;gap:20px;grid-template-columns:minmax(0,1fr) 340px}.pipeline-main,.pipeline-builder,.pipeline-steps{display:grid;gap:14px}.pipeline-submit-row{align-items:center;display:flex;gap:16px;justify-content:space-between;margin-top:18px}.pipeline-submit-row div{display:grid;gap:4px}.pipeline-submit-row span,.muted-text,.pipeline-tool-picker small,.pipeline-step small{color:#667085}.pipeline-tool-picker{display:grid;gap:10px;grid-template-columns:repeat(2,minmax(0,1fr))}.pipeline-tool-picker button{align-items:center;background:#f8fafc;border:1px solid #dfe7ef;border-radius:8px;color:#1f2933;display:grid;gap:10px;grid-template-columns:28px minmax(0,1fr);min-height:78px;padding:12px;text-align:left}.pipeline-tool-picker span,.pipeline-step summary span{display:grid;gap:3px;min-width:0}.pipeline-tool-picker svg,.pipeline-step svg{height:18px;width:18px}.pipeline-step{background:#f8fafc;border:1px solid #dfe7ef;border-radius:8px;padding:10px}.pipeline-step summary{align-items:center;cursor:pointer;display:grid;gap:8px;grid-template-columns:24px minmax(0,1fr) auto auto auto 22px;list-style:none}.pipeline-step summary::-webkit-details-marker{display:none}.pipeline-step summary button{background:#fff;border:1px solid #cbd5e1;border-radius:8px;color:#43546a;font-size:13px;font-weight:800;min-height:34px;padding:0 10px}.pipeline-step summary button:has(svg){align-items:center;display:inline-flex;justify-content:center;padding:0;width:36px}.pipeline-step[open] summary{margin-bottom:12px}.pipeline-option-grid{display:grid;gap:10px;grid-template-columns:repeat(2,minmax(0,1fr))}.single-tool-section{display:grid;gap:14px;margin-top:28px}.single-tool-section h2{margin:0}.field{display:grid;gap:7px}.field span,.toggle span{color:#43546a;font-size:13px;font-weight:800}.field input,.field select{border:1px solid #cbd5e1;border-radius:8px;min-height:42px;padding:8px 10px;width:100%}.toggle{align-items:center;border:1px solid #d7dee8;border-radius:8px;display:flex;gap:10px;min-height:42px;padding:8px 10px}.toggle input{height:18px;width:18px}.dropzone{align-items:center;border:2px dashed #9aaec1;border-radius:8px;color:#235165;display:grid;gap:12px;justify-items:center;min-height:230px;padding:28px;text-align:center}.dropzone.dragging{background:#eef8fb;border-color:#12636f}.dropzone input{height:1px;opacity:0;position:absolute;width:1px}.file-list,.result-list,.status-list{display:grid;gap:8px;margin-top:16px}.file-row,.result-row,.status-row{align-items:center;background:#f8fafc;border:1px solid #dfe7ef;border-radius:8px;display:grid;gap:12px;grid-template-columns:minmax(0,1fr) auto 38px;min-height:48px;padding:8px 10px 8px 12px}.file-row span:first-child,.result-row strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.icon-button{align-items:center;background:#fff;border:1px solid #cbd5e1;border-radius:8px;color:#52657a;display:inline-flex;height:36px;justify-content:center;width:36px}.primary-button,.download-button{align-items:center;background:#12636f;border:0;border-radius:8px;color:#fff;display:inline-flex;font-weight:800;gap:8px;justify-content:center;min-height:44px;padding:0 16px;text-decoration:none}.action-row{display:flex;justify-content:flex-end;margin-top:18px}.status-card{display:grid;gap:14px}.status-heading{align-items:center;display:flex;gap:10px}.progress-track{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:#e4eaf0;border:0;border-radius:999px;height:10px;overflow:hidden;width:100%}.progress-track::-webkit-progress-bar{background:#e4eaf0}.progress-track::-webkit-progress-value,.progress-track::-moz-progress-bar{background:#218875}.download-panel{display:grid;gap:12px}.result-row{grid-template-columns:minmax(0,1fr) auto}.error-text{color:#9a3412;font-weight:700}.hint-text{color:#52657a;font-weight:700}.preview-panel{background:#f8fafc;border:1px solid #dfe7ef;border-radius:8px;display:grid;justify-items:center;margin-top:18px;min-height:120px;overflow:auto;padding:14px}.preview-canvas{background:#e4eaf0;border-radius:8px;max-width:100%;touch-action:none}.photo-editor-shell{display:grid;gap:20px;grid-template-columns:minmax(0,1fr) 360px}.photo-editor-workspace{display:grid;gap:16px}.photo-drop{align-items:center;border:2px dashed #9aaec1;border-radius:8px;color:#235165;cursor:pointer;display:grid;gap:8px;justify-items:center;min-height:150px;padding:22px;text-align:center}.photo-drop.compact{align-items:center;grid-template-columns:auto minmax(0,1fr);justify-items:start;min-height:82px;text-align:left}.photo-drop span{color:#667085;font-size:14px}.photo-drop input{height:1px;opacity:0;position:absolute;width:1px}.photo-canvas-frame{align-items:center;background:linear-gradient(45deg,#dfe7ef 25%,transparent 25%),linear-gradient(-45deg,#dfe7ef 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#dfe7ef 75%),linear-gradient(-45deg,transparent 75%,#dfe7ef 75%);background-color:#f8fafc;background-position:0 0,0 8px,8px -8px,-8px 0;background-size:16px 16px;border:1px solid #dfe7ef;border-radius:8px;display:flex;justify-content:center;min-height:420px;overflow:auto;padding:16px}.photo-empty{align-items:center;color:#667085;display:flex;font-weight:800;min-height:240px}.photo-stage{background:#fff;box-shadow:0 16px 34px #1f293324}.photo-editor-options h2{font-size:16px;margin:0}.mini-toolbar,.segmented,.shape-actions,.export-actions,.inline-fields{display:flex;gap:8px}.mini-toolbar{align-items:center;justify-content:space-between}.mini-toolbar span{color:#667085;font-size:13px;font-weight:800}.segmented,.shape-actions,.export-actions{flex-wrap:wrap}.segmented button,.shape-actions button{align-items:center;background:#fff;border:1px solid #cbd5e1;border-radius:8px;color:#1f2933;display:inline-flex;font-weight:800;justify-content:center;min-height:38px;min-width:44px;padding:0 12px}.crop-grid{display:grid;gap:8px;grid-template-columns:repeat(2,minmax(0,1fr))}.inline-fields>.field{flex:1}.slider-field span{align-items:center;display:flex;justify-content:space-between}.slider-field strong{color:#1f2933}.slider-field input[type=range]{padding:0}.export-actions .download-button{flex:1;min-width:96px}.input-tabs{background:#eef3f7;border:1px solid #d7dee8;border-radius:8px;display:grid;gap:4px;grid-template-columns:repeat(3,minmax(0,1fr));margin-bottom:16px;padding:4px}.input-tabs button{align-items:center;background:transparent;border:0;border-radius:6px;color:#43546a;display:inline-flex;font-weight:800;gap:8px;justify-content:center;min-height:42px}.input-tabs button.active{background:#fff;color:#12636f;box-shadow:0 1px 4px #1f29331f}.input-tabs svg,.html-upload svg{height:20px;width:20px}.code-input{border:1px solid #cbd5e1;border-radius:8px;font-family:Cascadia Code,SFMono-Regular,Consolas,monospace;min-height:330px;padding:12px;resize:vertical;width:100%}.html-upload{align-items:center;border:2px dashed #9aaec1;border-radius:8px;color:#235165;cursor:pointer;display:grid;gap:10px;justify-items:center;min-height:250px;padding:28px;text-align:center}.html-upload span{color:#667085}.html-upload input{height:1px;opacity:0;position:absolute;width:1px}@media(max-width:900px){.tool-grid,.tool-grid.compact,.tool-layout,.photo-editor-shell,.bulk-layout,.pipeline-tool-picker{grid-template-columns:1fr}.pipeline-step summary{grid-template-columns:24px minmax(0,1fr) auto}.pipeline-step summary button,.pipeline-step summary>svg:last-child{grid-column:auto}.topbar{align-items:flex-start;display:grid;padding:16px 20px}}
