/* Browser workspaces share the studio's established lilac, cyan and rose palette. */
body[data-page="/tools/"] .route-hero{padding-bottom:28px}body[data-page="/tools/"] .route-hero-details{display:block;margin-top:20px}body[data-page="/tools/"] .route-hero-art{display:none}body[data-page="/tools/"] .route-hero-intro{max-width:720px}body[data-page="/tools/"] .route-hero h1{font-size:clamp(46px,7vw,100px)}
.free-tools{padding-top:35px;padding-bottom:60px;color:#30243d;scroll-margin-top:110px}.tools-intro{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:24px}.tools-intro h2{font:400 38px/1.15 Inter,sans-serif;letter-spacing:-.04em;margin:12px 0 0}.tools-local{display:flex;align-items:center;gap:8px;white-space:nowrap;font:12px Inter,sans-serif;color:#695678}.tools-local i{width:7px;height:7px;border-radius:50%;background:#4c9b9d;box-shadow:0 0 0 5px #69dce820}
.tools-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:20px}.tools-tabs button{position:relative;display:flex;align-items:center;gap:15px;padding:22px 18px;border:1px solid #c7b9d3;border-radius:16px;min-width:0;text-align:left;cursor:pointer;color:#55405f;background:linear-gradient(140deg,#ffffffa6,#eee6f38c);box-shadow:inset 0 1px #fff;transition:transform .25s,border-color .25s,background .25s}.tools-tabs button[aria-selected=true]{border-color:#8d64b8;background:linear-gradient(125deg,#af8aff30,#69dce81a);box-shadow:inset 0 0 0 1px #af8aff44,0 7px 22px #76618c12}.tools-tabs button:hover{transform:translateY(-3px)}.tool-tab-glyph{display:grid;place-items:center;width:45px;height:45px;flex-shrink:0;border:1px solid #af8aff50;background:#fff5;border-radius:50%;box-shadow:inset 0 0 14px #69dce830;color:#83639e;font:32px Inter,sans-serif;transition:transform .5s}.tools-tabs button:hover .tool-tab-glyph{transform:rotate(25deg)}.tools-tabs button>span:nth-child(2){display:grid;gap:6px;min-width:0}.tools-tabs small{font:600 8px Inter,sans-serif;letter-spacing:.13em;color:#8a729c}.tools-tabs strong{font:500 20px/1.2 Inter,sans-serif;letter-spacing:-.02em}.tools-tabs button>span>span{font:11px/1.5 Inter,sans-serif;color:#7c6888}.tools-tabs b{font-weight:400;color:#9679a8;margin-left:auto}
.tool-panel{position:relative;overflow:hidden;isolation:isolate;padding:30px;border:1px solid #c9b8d7;border-radius:24px;background:radial-gradient(ellipse at 100% 0,#69dce815,transparent 55%),linear-gradient(145deg,#ffffffd9,#f0e9f6b8);box-shadow:inset 0 1px #fff,0 20px 60px #5b426f0d;backdrop-filter:blur(12px)}.tool-panel[hidden]{display:none}.tool-panel:not([hidden]){animation:tool-enter .3s ease-out}.tool-panel-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}.tool-kicker{font:600 9px Inter,sans-serif;letter-spacing:.14em;color:#9373a8}.tool-panel h3{font:400 30px/1.2 Inter,sans-serif;letter-spacing:-.035em;margin:12px 0}.tool-badge{font:11px Inter,sans-serif;white-space:nowrap;border:1px solid #c4b0d4;border-radius:30px;padding:9px 12px;background:#ffffff6b;color:#78608c}.tool-description{font:14px/1.75 Inter,sans-serif;color:#79658a;max-width:780px;margin:0 0 26px}.tool-workspace{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px}.tool-input-side,.tool-output-side{min-width:0}.tool-field{display:block;font:500 12px/1.6 Inter,sans-serif;color:#634a77;margin:16px 0}.tool-field small{font-weight:400;color:#8a739b}.tool-field input:not([type=range]),.tool-field select,.tool-field textarea{display:block;width:100%;min-width:0;padding:12px;border:1px solid #c7b9d3;border-radius:10px;background:#fffc;color:#35283f;font:400 14px/1.5 Inter,sans-serif;margin-top:6px}.tool-field textarea{resize:vertical;min-height:86px;max-height:400px}.tool-field-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 12px}.tool-field input[type=range]{width:100%;accent-color:#8863ac;margin:15px 0}.tool-field output{float:right;font-size:11px;color:#8c6ba2}.tool-upload{position:relative;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:8px;min-height:164px;padding:18px;cursor:pointer;border:1px dashed #ad90c4;border-radius:14px;background:radial-gradient(ellipse at 50% 0,#af8aff15,transparent 70%),#ffffff66;transition:border-color .2s,background .2s}.tool-upload strong{font:500 16px Inter,sans-serif;color:#664c7d}.tool-upload>span:last-of-type{font:11px Inter,sans-serif;color:#8a729b}.tool-upload-glyph{display:grid;place-items:center;border-radius:50%;width:40px;height:40px;background:#e9dff3;color:#825f9d;font:24px Inter,sans-serif}.tool-upload input{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer}.tool-upload:hover,.tool-upload:focus-within{border-color:#79549c;background:#eee3fa}.tool-upload:focus-within{outline:2px solid #816098;outline-offset:3px}.tool-example-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:12px}.tool-example-row>span{font:10px Inter,sans-serif;color:#92799e}.tool-image-stage{display:grid;place-items:center;max-height:210px;margin-top:16px;background:repeating-conic-gradient(#e3dfe9 0 25%,#f7f5f9 0 50%) 50%/18px 18px;border-radius:12px;overflow:hidden}.tool-image-stage[hidden]{display:none}.tool-image-stage img{max-width:100%;max-height:210px;object-fit:contain}.tool-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:16px}.tool-button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:11px 16px;border:1px solid #bda6cf;background:#fff7;border-radius:10px;color:#6c4a84;font:500 12px/1.4 Inter,sans-serif;cursor:pointer;transition:transform .2s,background .2s}.tool-button:hover:not(:disabled){background:#e7d8f5;transform:translateY(-1px)}.tool-button--primary{background:#362343;border-color:#362343;color:#f9f4ff}.tool-button--primary:hover:not(:disabled){background:#58376c}.tool-button:disabled{opacity:.45;cursor:not-allowed}.tool-button[hidden]{display:none}.tool-output-side{border:1px solid #d2c3dd;border-radius:16px;padding:20px;background:linear-gradient(145deg,#f3ecf899,#e9e0f177)}.tool-output-label{display:flex;justify-content:space-between;align-items:center;gap:8px;font:500 12px Inter,sans-serif;margin-bottom:12px;color:#735386}.tool-output-label span{font:500 8px Inter,sans-serif;letter-spacing:.12em;color:#a28caf;white-space:nowrap}.tool-output-side>textarea{display:block;width:100%;min-height:310px;max-height:700px;padding:18px;border:1px solid #70607e;border-radius:12px;background:radial-gradient(ellipse at 100% 0,#69dce80b,transparent 60%),#251c31;color:#e9dff2;font:400 14px/1.7 ui-monospace,SFMono-Regular,Consolas,monospace;resize:vertical}.tool-output-side>textarea::placeholder{color:#a997b9}.tool-note{font:400 11px/1.7 Inter,sans-serif;color:#8c7499;margin:14px 0 0}.tool-status{font:400 12px/1.65 Inter,sans-serif;color:#80638f;min-height:40px;margin:14px 0 0}.tool-status[data-error=true]{color:#9a3058}.tool-panel progress{display:block;width:100%;height:6px;accent-color:#9370b9;margin-top:18px}.tool-panel progress[hidden]{display:none}.tool-canvas-stage{position:relative;display:grid;place-items:center;overflow:hidden;border:1px solid #cbbcd6;border-radius:12px;min-height:340px;background:repeating-conic-gradient(#eee9f2 0 25%,#faf8fc 0 50%) 50%/20px 20px}.tool-canvas-stage canvas{display:block;max-width:100%;max-height:440px;object-fit:contain;width:auto;height:auto}.tool-canvas-stage canvas[hidden]{display:none}.tool-empty{display:grid;place-items:center;text-align:center;color:#a18aad;padding:28px}.tool-empty[hidden]{display:none}.tool-empty span{font-size:70px;color:#b49ac7}.tool-empty p{font:14px/1.6 Inter,sans-serif}.tool-image-meta{font:500 11px/1.6 Inter,sans-serif;color:#7e6090;margin:14px 0}.tools-bottom-note{display:flex;align-items:center;gap:16px;padding:22px 4px;color:#90789d}.tools-bottom-note>span{font-size:26px;color:#b59ac8}.tools-bottom-note p{font:12px/1.7 Inter,sans-serif;margin:0}.tools-bottom-note p a{color:#71458e}.tools-bottom-note>a{font:10px/1.5 Inter,sans-serif;margin-left:auto;text-decoration:underline}.tool-confirm-dialog{max-width:min(440px,90vw);padding:28px;border:1px solid #b99dcd;border-radius:20px;background:#f7effc;color:#432b54}.tool-confirm-dialog h3{font:26px/1.2 Inter,sans-serif;margin:0 0 16px}.tool-confirm-dialog p{font:14px/1.7 Inter,sans-serif}.tool-confirm-dialog::backdrop{background:#160c2288;backdrop-filter:blur(5px)}.free-tools :is(button,input,select,textarea,a):focus-visible{outline:3px solid #7192ad;outline-offset:3px}.no-js .tools-tabs,.no-js .tool-actions,.no-js .tool-example-row,.no-js .tool-upload{display:none}.no-js .tool-panel[hidden]{display:block;margin-top:20px}.tool-noscript{padding:20px;font:14px/1.6 Inter,sans-serif}.tool-panel form{margin:0}
@keyframes tool-enter{from{opacity:.45;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(max-width:1000px){.tool-tab-glyph{width:32px;height:32px;font-size:23px}.tools-tabs button{gap:10px;padding:18px 13px}.tools-tabs strong{font-size:17px}.tools-tabs b{display:none}.tool-workspace{gap:16px}.tool-panel{padding:24px}.tool-output-side{padding:16px}.tool-panel h3{font-size:27px}.tool-badge{font-size:10px}}
@media(max-width:767px){body[data-page="/tools/"] .route-hero{padding-bottom:15px}body[data-page="/tools/"] .route-hero h1{font-size:46px}body[data-page="/tools/"] .route-hero-details{margin-top:16px}.free-tools{padding-top:18px;padding-bottom:28px;scroll-margin-top:80px}.tools-intro{display:grid;gap:14px;margin-bottom:18px}.tools-intro h2{font-size:29px}.tools-local{font-size:10px;margin-left:5px}.tools-tabs{gap:7px;margin-bottom:12px}.tools-tabs button{display:flex;flex-direction:column;align-items:flex-start;gap:9px;padding:12px 10px;min-height:128px;border-radius:12px}.tools-tabs button>span:nth-child(2){gap:6px}.tools-tabs strong{font-size:13px;line-height:1.3}.tools-tabs small{font-size:7px;letter-spacing:.06em}.tools-tabs button>span>span{display:none}.tool-tab-glyph{width:28px;height:28px;font-size:22px}.tool-panel{padding:18px 14px;border-radius:16px}.tool-panel-heading{display:grid;gap:4px}.tool-panel h3{font-size:25px;line-height:1.2;margin:9px 0}.tool-kicker{font-size:8px;letter-spacing:.08em}.tool-badge{justify-self:start;margin:4px 0 10px;padding:6px 9px;font-size:9px}.tool-description{font-size:12px;line-height:1.7;margin-bottom:18px}.tool-workspace{grid-template-columns:minmax(0,1fr);gap:18px}.tool-upload{min-height:132px;padding:16px}.tool-upload strong{font-size:14px}.tool-upload>span:last-of-type{font-size:10px}.tool-upload-glyph{width:32px;height:32px;font-size:22px}.tool-field-grid{gap:0 10px}.tool-field{font-size:11px;margin:12px 0}.tool-field input:not([type=range]),.tool-field select,.tool-field textarea{font-size:16px;padding:10px 8px}.tool-field select{overflow:hidden;text-overflow:ellipsis;padding-right:20px}.tool-field textarea{font-size:16px}.tool-button{font-size:11px;min-height:44px;padding:10px 12px}.tool-example-row{gap:8px;margin-top:10px}.tool-example-row>span{font-size:10px}.tool-status{font-size:11px;min-height:34px}.tool-output-side{padding:14px 12px;border-radius:12px}.tool-output-label{font-size:11px;flex-wrap:wrap}.tool-output-side>textarea{min-height:260px;font-size:16px;padding:14px 12px;line-height:1.6}.tool-note{font-size:10px}.tool-canvas-stage{min-height:240px}.tool-canvas-stage canvas{max-height:360px}.tool-image-meta{font-size:10px}.tools-bottom-note{flex-wrap:wrap;gap:10px;padding:18px 0}.tools-bottom-note p{font-size:11px;flex:1}.tools-bottom-note>a{flex-basis:100%;margin-left:34px}.tool-image-stage{max-height:150px}.tool-image-stage img{max-height:150px}}
@media(prefers-reduced-motion:reduce){.free-tools *{animation:none!important;transition:none!important;scroll-behavior:auto!important;transform:none!important}}
.tool-anchor{display:block;height:0;scroll-margin-top:110px}
