.tools-page{--tool-white: #fffefa;--tool-surface: #f0ece4;--tool-border: #ded9cf;--tool-green: #216347;--tool-red: #a62d25}.tools-page .tools-main{width:min(calc(100% - 80px),1280px);min-height:60vh;margin-inline:auto;padding:122px 0 80px}.tool-directory-hero{padding:18px 0 28px;text-align:center}.tool-eyebrow{display:flex;align-items:center;justify-content:center;gap:9px;margin:0 0 13px;color:var(--muted);font:11px var(--mono);letter-spacing:.055em;text-transform:uppercase}.tool-eyebrow>span{width:7px;height:7px;border-radius:50%;background:var(--orange)}.tool-directory-hero h1{margin:0;font-size:clamp(36px,4.2vw,57px);line-height:1.1;letter-spacing:-.045em;font-weight:700}.tool-directory-hero h1 em{color:var(--orange-deep);font-family:Georgia,serif;font-weight:400}.tool-directory-hero>p:not(.tool-eyebrow){margin:15px 0 0;color:var(--ink-soft);font-size:17px;line-height:1.5}.tool-benefits{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 20px;margin-top:18px;color:var(--muted);font-size:12px}.tool-benefits span{display:inline-flex;align-items:center;gap:7px}.tool-benefits span:before{color:var(--tool-green);content:"✓";font-size:12px}.tool-popular{padding:22px 0 30px}.tool-group-heading{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px 18px;margin-bottom:17px;text-align:center}.tool-group-heading h2{margin:0;font-size:22px;letter-spacing:-.04em;font-weight:600}.tool-group-heading>span{color:var(--muted);font:10px var(--mono)}.tool-group-heading>a{color:var(--orange-deep);font-size:13px;text-decoration:underline;text-underline-offset:4px}.tool-popular-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.tool-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.tool-card{position:relative;display:flex;flex-direction:column;align-items:center;gap:15px;padding:24px 20px;border:1px solid var(--tool-border);border-radius:var(--radius);background:var(--tool-white);text-align:center;transition:border-color .18s,transform .18s,box-shadow .18s}.tool-card:hover{transform:translateY(-3px);border-color:var(--orange);box-shadow:0 8px 25px #16161608}.tool-card:focus-visible{outline:3px solid var(--orange);outline-offset:3px}.tool-card-icon,.tool-detail-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:11px;color:var(--orange-deep);background:#ff5c000e}.tool-card-icon svg,.tool-detail-icon svg{width:23px;height:23px}.tool-card-copy{display:grid;gap:8px}.tool-card-copy strong{font-size:16px;line-height:1.3;font-weight:700;letter-spacing:-.015em}.tool-card-copy>span{color:#68655d;font-size:13px;line-height:1.5}.tool-card-arrow{position:absolute;top:18px;right:18px;color:#8c877b;font-size:16px}.tool-card.featured{background:var(--ink);border-color:var(--ink);color:#fff}.tool-card.featured .tool-card-icon{color:#ff8b4a;background:#ffffff0d}.tool-card.featured .tool-card-copy>span{color:#c4c1bb}.tool-card.featured .tool-card-arrow{color:#ff8b4a}.tool-discovery{padding:24px 0 18px;border-top:1px solid var(--tool-border)}.tool-search{width:min(100%,670px);display:flex;align-items:center;gap:13px;min-height:56px;margin:0 auto;padding:0 17px;border:1px solid var(--tool-border);border-radius:var(--radius);background:var(--tool-white)}.tool-search:focus-within{border-color:var(--orange);outline:3px solid #ff5c0012}.tool-search>svg{width:21px;height:21px;color:var(--orange-deep);flex-shrink:0}.tool-search input{width:100%;min-width:0;padding:16px 0;border:0;background:transparent;outline:0;color:var(--ink);font:15px var(--sans)}.tool-search kbd{padding:3px 6px;border:1px solid var(--tool-border);border-radius:4px;color:var(--muted);font:12px var(--mono)}.tool-categories{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin-top:16px}.tool-categories button{min-height:40px;padding:0 14px;border:1px solid transparent;border-radius:9px;background:transparent;color:#68655d;cursor:pointer;font-size:13px}.tool-categories button:hover{background:#ebe5db;color:var(--ink)}.tool-categories button.is-active{border-color:var(--ink);background:var(--ink);color:#fff}.tool-result-count{margin:4px 0 26px;color:var(--muted);font-size:12px;text-align:center}.tool-group{margin-top:38px}.tool-group:first-child{margin-top:0}.tool-empty{padding:40px 15px;text-align:center}.tool-empty h2{font-size:25px}.tool-empty p{color:var(--muted)}.tool-about{max-width:650px;margin:64px auto 0;text-align:center}.tool-about h2{font-size:29px;letter-spacing:-.04em}.tool-about p{color:var(--ink-soft);font-size:15px;line-height:1.8}.tool-breadcrumb{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin:0 0 22px;color:#716d64;font-size:11px;line-height:1.6}.tool-breadcrumb a:hover{color:var(--orange-deep);text-decoration:underline}.tool-detail-header{max-width:800px;margin:0 auto 26px;text-align:center}.tool-detail-icon{width:44px;height:44px;margin:0 auto 13px}.tool-detail-header .tool-eyebrow{margin-bottom:8px;font-size:10px}.tool-detail-header h1{margin:0;font-size:clamp(28px,3.3vw,43px);line-height:1.15;letter-spacing:-.045em}.tool-detail-header>p:last-of-type{max-width:680px;margin:13px auto 0;color:var(--ink-soft);font-size:15px;line-height:1.65}.tool-detail-header .tool-benefits{margin-top:13px;font-size:11px}.tool-workspace{max-width:1100px;margin:0 auto;border:1px solid var(--tool-border);border-radius:var(--radius);background:var(--tool-white);box-shadow:0 5px 24px #16161604;overflow:hidden}.tool-loading{padding:60px;color:var(--muted);text-align:center}.tool-toolbar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;padding:16px 23px;border-bottom:1px solid var(--tool-border);background:#f8f6f1}.tool-toolbar-title{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600}.tool-toolbar-title:before{width:6px;height:6px;border-radius:50%;background:var(--tool-green);content:""}.tool-toolbar-actions{display:flex;gap:14px}.tool-text-button{padding:6px 0;border:0;background:transparent;color:#69645b;cursor:pointer;font:12px var(--sans);text-decoration:underline;text-underline-offset:3px}.tool-text-button:hover{color:var(--orange-deep)}.tool-body{padding:24px}.tool-controls{display:flex;align-items:end;justify-content:center;flex-wrap:wrap;gap:16px;margin:0 0 22px}.tool-controls>.tool-field{flex:1 1 170px;max-width:350px}.tool-field{display:flex;flex-direction:column;gap:8px;min-width:0}.tool-field>label,.tool-label{display:block;color:#49463f;font-size:13px;font-weight:600}.tool-hint{color:var(--muted);font-size:11px;line-height:1.6}.tool-field input:not([type=checkbox]):not([type=file]):not([type=range]):not([type=color]),.tool-field textarea,.tool-field select,.tool-input{width:100%;min-width:0;min-height:46px;padding:12px 13px;border:1px solid var(--tool-border);border-radius:9px;outline:0;background:#fff;color:var(--ink);font:15px var(--sans);transition:border-color .15s,box-shadow .15s}.tool-field select{appearance:none;padding-right:34px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%236b665c' stroke-width='1.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;cursor:pointer}.tool-field textarea{min-height:250px;resize:vertical;line-height:1.65}.tool-field textarea.code{font:13px/1.7 var(--mono);tab-size:2}.tool-field textarea[readonly]{background:#f7f5ef}.tool-field input:focus-visible,.tool-field textarea:focus-visible,.tool-field select:focus-visible{border-color:var(--orange)!important;box-shadow:0 0 0 3px #ff5c0014}.tool-field input[type=range]{width:100%;height:30px;accent-color:var(--orange);cursor:pointer}.tool-field input[type=color]{width:100%;height:47px;padding:4px;border:1px solid var(--tool-border);border-radius:9px;background:#fff;cursor:pointer}.tool-field input[type=checkbox]{width:18px;height:18px;margin:0;accent-color:var(--orange)}.tool-check{display:inline-flex;align-items:center;gap:8px;min-height:37px;color:#49463f;font-size:13px;cursor:pointer}.tool-check input{width:17px;height:17px;accent-color:var(--orange)}.tool-editors{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.tool-editor-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:26px}.tool-editor-heading label{font-size:13px;font-weight:600}.tool-editor-meta{color:var(--muted);font:10px var(--mono)}.tool-result-actions{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:14px;margin-top:7px}.tool-action-bar{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px;padding:19px 24px;border-top:1px solid var(--tool-border);background:#f8f6f1}.tool-button{min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 21px;border:1px solid var(--orange);border-radius:9px;background:var(--orange);color:var(--ink);cursor:pointer;font-size:13px;font-weight:700;transition:background .15s,border-color .15s,color .15s}.tool-button:hover{border-color:var(--ink);background:var(--ink);color:#fff}.tool-button.secondary{border-color:var(--tool-border);background:#fff;color:var(--ink-soft)}.tool-button.secondary:hover{border-color:var(--ink);color:var(--ink)}.tool-button:disabled{opacity:.55;cursor:wait}.tool-button:focus-visible,.tool-text-button:focus-visible,.tool-categories button:focus-visible{outline:3px solid #ff5c0050;outline-offset:3px}.tool-status{min-height:21px;margin:14px 0 0;color:var(--muted);font-size:12px;line-height:1.6;text-align:center;overflow-wrap:anywhere}.tool-status.is-error{color:var(--tool-red)}.tool-status.is-success{color:var(--tool-green)}.tool-status:empty{display:none}.tool-preview{min-height:130px;padding:22px;border:1px solid var(--tool-border);border-radius:10px;background:#f7f5ef;line-height:1.65;overflow:auto;overflow-wrap:anywhere}.tool-preview :first-child{margin-top:0}.tool-preview h1{font-size:32px}.tool-preview h2{font-size:25px}.tool-preview h3{font-size:20px}.tool-preview a{color:var(--orange-deep);text-decoration:underline}.tool-preview pre{padding:13px;border-radius:7px;background:#e9e5db;overflow:auto}.tool-preview table{width:100%;border-collapse:collapse}.tool-preview td,.tool-preview th{padding:7px;border:1px solid var(--tool-border)}.tool-drop{position:relative;min-height:170px;display:grid;align-content:center;justify-items:center;gap:9px;padding:25px;border:1.5px dashed #c4bdaf;border-radius:12px;background:#f7f5ef;color:var(--ink-soft);text-align:center;transition:border .15s,background .15s}.tool-drop:hover,.tool-drop.is-dragging,.tool-drop:focus-within{border-color:var(--orange);background:#fff4e9}.tool-drop input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.tool-drop svg{width:30px;height:30px;color:var(--orange-deep)}.tool-drop strong{font-size:15px}.tool-drop>span{color:var(--muted);font-size:12px}.tool-file-summary{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px;margin:13px 0 0;color:var(--muted);font-size:12px;overflow-wrap:anywhere;text-align:center}.tool-image-layout{display:grid;grid-template-columns:minmax(220px,.72fr) minmax(0,1.28fr);gap:24px;margin-top:24px}.tool-image-settings{display:grid;align-content:start;gap:15px}.tool-image-preview{min-height:260px;max-height:470px;display:flex;align-items:center;justify-content:center;padding:12px;border:1px solid var(--tool-border);border-radius:10px;background-color:#edeae3;background-image:linear-gradient(45deg,#e3dfd6 25%,transparent 25%),linear-gradient(-45deg,#e3dfd6 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e3dfd6 75%),linear-gradient(-45deg,transparent 75%,#e3dfd6 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0;overflow:hidden}.tool-image-preview canvas,.tool-image-preview img{width:auto;height:auto;max-width:100%;max-height:420px;object-fit:contain}.tool-image-preview.is-picker{cursor:crosshair}.tool-image-placeholder{color:#817a6e;font-size:13px}.tool-image-result{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:13px;margin-top:18px;text-align:center}.tool-result-chip{padding:9px 13px;border-radius:7px;background:#eeeae0;color:var(--ink-soft);font-size:12px}.tool-result-chip.good{background:#e4f0e8;color:var(--tool-green)}.tool-progress{margin-top:18px;color:var(--orange-deep);font-size:12px;text-align:center}.tool-progress:before{width:14px;height:14px;display:inline-block;margin:0 9px -3px 0;border:2px solid #ff5c0035;border-top-color:var(--orange);border-radius:50%;content:"";animation:tool-spin .8s linear infinite}@keyframes tool-spin{to{transform:rotate(360deg)}}.tool-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:19px}.tool-stat{padding:18px 10px;border:1px solid var(--tool-border);border-radius:9px;background:#f7f5ef;text-align:center}.tool-stat strong{display:block;color:var(--ink);font-size:28px;letter-spacing:-.035em}.tool-stat span{display:block;margin-top:6px;color:var(--muted);font-size:11px}.tool-value{display:grid;gap:10px;padding:25px;border:1px solid var(--tool-border);border-radius:10px;background:#f7f5ef;text-align:center}.tool-value strong{font-size:clamp(25px,4vw,43px);letter-spacing:-.04em;overflow-wrap:anywhere}.tool-value>span{color:var(--muted);font-size:13px;line-height:1.6}.tool-key-values{display:grid;gap:0;margin-top:18px;border:1px solid var(--tool-border);border-radius:10px;overflow:hidden}.tool-key-values>div{display:grid;grid-template-columns:minmax(100px,.3fr) minmax(0,1fr);gap:14px;padding:13px 15px;border-bottom:1px solid var(--tool-border);font-size:13px}.tool-key-values>div:last-child{border-bottom:0}.tool-key-values strong{color:#716b61;font-weight:500}.tool-key-values code{color:var(--ink);font:12px/1.6 var(--mono);overflow-wrap:anywhere;white-space:pre-wrap}.tool-swatches{display:flex;flex-wrap:wrap;justify-content:center;gap:9px;margin:18px 0}.tool-swatch{min-width:60px;min-height:65px;flex:1 1 60px;padding:40px 8px 10px;border:1px solid #1616161a;border-radius:9px;cursor:pointer;color:#fff;font:11px var(--mono);text-shadow:0 1px 5px #000}.tool-swatch:focus-visible{outline:3px solid var(--orange);outline-offset:3px}.tool-color-preview{height:125px;margin-bottom:18px;border:1px solid var(--tool-border);border-radius:10px}.tool-diff{margin-top:20px;padding:0;background:#f7f5ef;font:12px/1.8 var(--mono);white-space:pre-wrap}.tool-diff>span{display:block;padding:2px 12px}.tool-diff .added{background:#e2f0e3;color:#255334}.tool-diff .removed{background:#fae5df;color:#933c30}.tool-warning{padding:12px 16px;border-radius:8px;background:#fff0dc;color:#7a4a20;font-size:12px;line-height:1.65}.tool-page-list{display:grid;gap:9px;margin:18px 0}.tool-page-item{display:flex;align-items:center;gap:10px;padding:10px;border:1px solid var(--tool-border);border-radius:8px}.tool-page-item img{width:43px;height:43px;object-fit:contain}.tool-page-item>span{min-width:0;flex:1;overflow-wrap:anywhere;color:var(--ink-soft);font-size:12px}.tool-page-item button{border:0;background:transparent;cursor:pointer;font-size:15px}.tool-instructions,.tool-faq,.tool-related{max-width:1100px;margin:48px auto 0}.tool-instructions h2,.tool-faq h2{margin:0 0 22px;font-size:24px;letter-spacing:-.035em;text-align:center}.tool-instructions ol{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin:0;padding:0;list-style:none;text-align:center}.tool-instructions li>span{display:block;color:var(--orange-deep);font:11px var(--mono)}.tool-instructions li>p{margin:11px 0 0;color:var(--ink-soft);font-size:13px;line-height:1.8}.tool-faq{max-width:780px}.tool-faq details{border-bottom:1px solid var(--tool-border)}.tool-faq summary{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:19px 0;font-size:14px;font-weight:600;cursor:pointer;list-style:none}.tool-faq summary::-webkit-details-marker{display:none}.tool-faq summary>span{color:var(--orange-deep);font-size:20px;font-weight:400}.tool-faq details[open] summary>span{transform:rotate(45deg)}.tool-faq details>p{margin:0 0 22px;color:var(--ink-soft);font-size:14px;line-height:1.8}.tool-url-preview{display:flex;flex-wrap:wrap;justify-content:center;gap:0;padding:28px 20px;border:1px solid var(--tool-border);border-radius:10px;background:#f7f5ef;font:17px/1.8 var(--mono);overflow-wrap:anywhere}.tool-url-preview>span{color:var(--muted)}.tool-url-preview>strong{color:var(--orange-deep);font-weight:500;overflow-wrap:anywhere;min-width:0}.tool-case-choices{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:24px}.tool-case-choices .tool-button{min-height:40px;padding:0 15px;font-size:12px}.tool-case-choices [aria-pressed=true]{border-color:var(--orange);background:#fff0df;color:#a53600}.tool-code-workspace .tool-field textarea.code{min-height:280px;background:#1c1d1c;border-color:#1c1d1c;color:#e9e6dd;caret-color:#ff9450}.tool-code-workspace .tool-field textarea.code::placeholder{color:#96968b}.tool-code-workspace .tool-field textarea.code[readonly]{background:#272927;border-color:#272927;color:#d8e5d2}.tool-noscript{padding:20px;border:1px solid var(--tool-border);text-align:center}.tool-status.is-error{margin-top:20px;padding:14px 17px;border:1px solid #dfaca3;border-radius:9px;background:#fff0ec;text-align:left;white-space:pre-wrap}.tool-status.is-error:before{display:block;margin-bottom:5px;font-size:13px;font-weight:700;content:"Check your input"}.tool-field [aria-invalid=true]{border-color:#b44635!important}.tool-key-values>div:has(button){grid-template-columns:minmax(70px,.2fr) minmax(0,1fr) auto;align-items:center}.tool-secret-display{position:relative;padding:30px;border-radius:12px;background:radial-gradient(ellipse at top right,#ff5c0020,transparent 70%),#191919;overflow:hidden;text-align:center}.tool-secret-label{color:#ff995b;font:10px var(--mono);letter-spacing:.12em}.tool-secret-value{display:block;margin:24px 0;color:#fff;font:25px/1.7 var(--mono);letter-spacing:.035em;overflow-wrap:anywhere;user-select:all}.tool-strength-meter{width:min(100%,400px);height:4px;margin:0 auto;border-radius:8px;overflow:hidden;background:#424242}.tool-strength-meter>span{display:block;height:100%;width:0;border-radius:inherit;background:var(--lime);transition:width .3s ease}.tool-secret-meta{margin-top:15px;color:#b5b2aa;font:11px/1.7 var(--mono)}.tool-generator-settings{max-width:620px;margin:25px auto 0}.tool-length-label{display:flex;align-items:center;justify-content:space-between;color:var(--ink-soft);font-size:13px}.tool-length-value{display:inline-grid;place-items:center;min-width:40px;min-height:32px;border-radius:7px;background:#ede7dc;color:var(--ink);font:16px var(--mono)}.tool-generator-settings>.tool-field:has(input[type=range])>label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.tool-generator-toggles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:15px}.tool-generator-toggles .tool-check{justify-content:center;min-height:47px;padding:8px;border:1px solid var(--tool-border);border-radius:8px;background:#f7f5ef;font-size:12px}.tool-generator-toggles .tool-check:has(input:checked){border-color:#ff5c0060;background:#fff2e6}.tool-generator-workspace .tool-action-bar{background:#fffefa}.tool-generator-workspace .tool-body{padding:25px}.tool-contrast-preview{padding:30px;border:1px solid #16161610;border-radius:10px;text-align:center}.tool-contrast-preview strong{font-size:30px;letter-spacing:-.04em}.tool-contrast-preview p{font-size:14px;line-height:1.6}.tool-gradient-preview{min-height:260px;margin-bottom:25px;border-radius:11px;border:1px solid #16161610}.tool-palette-large .tool-swatch{min-height:160px;display:flex;align-items:end;justify-content:center}.tool-qr-preview{display:flex;align-items:center;justify-content:center;min-height:300px;padding:25px;border-radius:12px;background:#f0ece4}.tool-qr-preview canvas{width:min(100%,300px);height:auto;padding:8px;border-radius:8px;background:#fff}.tool-qr-placeholder{color:var(--muted);font-size:13px;text-align:center}.tool-upload-symbol{display:grid;place-items:center;width:38px;height:38px;border-radius:10px;background:#fff;color:var(--orange-deep)!important;font-size:25px!important}.tool-ratio-stage{display:flex;justify-content:center;align-items:center;min-height:270px;margin-bottom:22px;padding:22px;border-radius:10px;background:#efebe2;overflow:hidden}.tool-ratio-frame{display:grid;place-items:center;min-width:24px;border:1px solid #ff8f4d;border-radius:9px;background:repeating-linear-gradient(0deg,transparent 0 35px,#ffffff09 35px 36px),repeating-linear-gradient(90deg,transparent 0 35px,#ffffff09 35px 36px),#191919;color:#ff9857}.tool-ratio-frame strong{font:24px var(--mono)}.tool-preview mark{padding:1px 0;border-radius:2px;background:#ffcf92;color:var(--ink)}@media (max-width: 1000px){.tool-popular-grid,.tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tool-categories{gap:4px}.tool-categories button{padding-inline:10px}}@media (max-width: 760px){.tools-page .tools-main{width:min(calc(100% - 32px),620px);padding:96px 0 55px}.tool-directory-hero{padding-top:10px}.tool-directory-hero>p:not(.tool-eyebrow){font-size:15px}.tool-card{padding:21px 14px}.tool-card-copy strong{font-size:14px}.tool-card-copy>span{font-size:12px}.tool-card-icon{width:36px;height:36px}.tool-card-arrow{right:12px;top:12px}.tool-group-heading h2{font-size:20px}.tool-popular{padding-top:7px}.tool-search input{font-size:16px}.tool-search kbd{display:none}.tool-categories{flex-wrap:nowrap;justify-content:start;overflow-x:auto;padding:3px 0 8px}.tool-categories button{flex-shrink:0;font-size:12px}.tool-toolbar{padding:13px 15px}.tool-body{padding:17px}.tool-editors{grid-template-columns:1fr;gap:20px}.tool-field textarea{min-height:200px}.tool-field input,.tool-field textarea,.tool-field select,.tool-field textarea.code{font-size:16px!important}.tool-text-button,.tool-case-choices .tool-button,.tool-categories button,.tool-check{min-height:44px}.tool-text-button{min-width:44px;padding-inline:5px}.tool-field input[type=range]{height:44px}.tool-page-item{display:grid;grid-template-columns:44px minmax(0,1fr) 44px 44px}.tool-page-item>span{grid-column:2 / -1}.tool-page-item>button:first-of-type{grid-column:2;justify-self:end}.tool-page-item>button{min-height:44px;min-width:44px}.tool-controls>.tool-field{max-width:none;flex-basis:130px}.tool-image-layout{grid-template-columns:1fr}.tool-image-preview{min-height:200px}.tool-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.tool-instructions ol{grid-template-columns:1fr;gap:20px}.tool-instructions li{display:flex;align-items:baseline;gap:14px;text-align:left}.tool-instructions li>p{margin:0}.tool-breadcrumb{font-size:10px}.tool-action-bar{padding:15px}.tool-detail-header{margin-bottom:23px}.tool-detail-header>p:last-of-type{font-size:14px}.tool-key-values>div{grid-template-columns:90px minmax(0,1fr);gap:10px}}@media (max-width: 420px){.tool-grid{grid-template-columns:1fr}.tool-popular-grid .tool-card-copy>span{display:none}.tool-popular-grid .tool-card{gap:10px;padding-block:18px}.tool-directory-hero h1{font-size:35px}.tool-benefits{gap:8px 12px;font-size:10px}.tool-action-bar .tool-button{flex-grow:1}.tool-toolbar-title{font-size:12px}}@media (max-width: 760px){.tool-secret-display{padding:23px 16px}.tool-secret-value{font-size:19px}.tool-generator-workspace .tool-body{padding:17px}.tool-generator-toggles{grid-template-columns:repeat(2,minmax(0,1fr))}.tool-palette-large .tool-swatch{min-height:95px}.tool-gradient-preview{min-height:200px}.tool-key-values>div:has(button){grid-template-columns:55px minmax(0,1fr) auto;gap:7px}}@media (prefers-reduced-motion: reduce){.tool-card{transition:none}.tool-progress:before{animation:none;border-style:dotted}}
