.tool-page{padding-top:112px}.tool-header{padding:28px;display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:center;margin-bottom:24px;border-radius:22px}.tool-header__icon{width:64px;height:64px;border-radius:16px;background:linear-gradient(135deg,rgba(15,98,254,.12),rgba(123,97,255,.12));color:var(--fpl-primary);display:inline-flex;align-items:center;justify-content:center}.tool-header__icon svg{width:32px;height:32px}.tool-header__badge{display:inline-block;font-size:.7rem;text-transform:uppercase;letter-spacing:.14em;font-weight:700;color:var(--fpl-primary);background:rgba(15,98,254,.08);padding:4px 10px;border-radius:999px;margin-bottom:8px}.tool-header__title{font-family:"Playfair Display",serif;font-size:clamp(1.7rem,3vw,2.2rem);margin:0 0 6px}.tool-header__lead{margin:0 0 10px;color:var(--fpl-ink-dim)}.tool-header__privacy{display:inline-flex;align-items:center;gap:6px;font-size:.82rem;color:var(--fpl-muted);margin:0}.tool-app{padding:24px;border-radius:20px;margin-bottom:24px}.tool-grid{display:grid;grid-template-columns:1fr 1.4fr 1fr;gap:18px}.tool-grid--inspect{grid-template-columns:1fr 1.5fr}.tool-grid--cph,.tool-grid--bg,.tool-grid--resize,.tool-grid--compress,.tool-grid--convert{grid-template-columns:1fr 1.4fr 1fr}.drop-zone{border:2px dashed rgba(15,98,254,.32);border-radius:16px;background:rgba(15,98,254,.04);min-height:280px;display:flex;align-items:stretch;transition:background .18s,border-color .18s}.drop-zone.is-drag,.drop-zone:hover{background:rgba(15,98,254,.08);border-color:var(--fpl-primary)}.drop-zone__inner{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:24px;text-align:center;color:var(--fpl-ink-dim);cursor:pointer;font-size:.95rem}.drop-zone__inner svg{color:var(--fpl-primary);opacity:.85;margin-bottom:8px}.drop-zone__inner strong{color:var(--fpl-ink);font-size:1rem}.drop-zone__inner span{color:var(--fpl-muted);font-size:.85rem}.tool-preview{position:relative;border-radius:16px;overflow:hidden;background:#fff;border:1px solid var(--fpl-line);min-height:280px;display:flex;align-items:center;justify-content:center}.tool-preview--checker{background:linear-gradient(45deg,#e6e9ee 25%,transparent 25%),linear-gradient(-45deg,#e6e9ee 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e6e9ee 75%),linear-gradient(-45deg,transparent 75%,#e6e9ee 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0}.tool-canvas{max-width:100%;max-height:520px;display:block}.tool-empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--fpl-muted);font-size:.9rem;text-align:center;padding:24px;pointer-events:none}.tool-preview.has-image .tool-empty{display:none}.tool-side{background:#fff;border:1px solid var(--fpl-line);border-radius:16px;padding:20px;display:flex;flex-direction:column;gap:14px}.tool-side h3{margin:0;font-size:1rem}.tool-side--wide{padding:0;background:0 0;border:0}.tool-side--wide .tool-table{width:100%;background:#fff;border:1px solid var(--fpl-line);border-radius:16px;overflow:hidden;border-collapse:collapse}.tool-control{display:flex;flex-direction:column;gap:6px;font-size:.85rem;color:var(--fpl-ink-dim)}.tool-control span{font-weight:600;color:var(--fpl-ink)}.tool-control input[type=number],.tool-control select,.tool-control input[type=range]{padding:10px 12px;border-radius:10px;border:1px solid var(--fpl-line-strong);background:#fff}.tool-control input[type=range]{padding:0;accent-color:var(--fpl-primary)}.tool-control--checkbox{flex-direction:row;align-items:center;gap:8px;cursor:pointer}.tool-control--checkbox input{margin:0}.tool-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}.stat-list{display:grid;gap:10px;margin:0}.stat-list div{display:flex;justify-content:space-between;gap:12px;font-size:.85rem;padding:8px 10px;background:var(--fpl-bg-2);border-radius:10px}.stat-list dt{color:var(--fpl-muted);margin:0}.stat-list dd{color:var(--fpl-ink);margin:0;font-weight:600;text-align:right}.tool-table{font-size:.88rem}.tool-table th,.tool-table td{padding:12px 14px;text-align:left;border-bottom:1px solid var(--fpl-line)}.tool-table th{background:var(--fpl-bg-2);color:var(--fpl-ink-dim);font-weight:700;font-size:.78rem;text-transform:uppercase;letter-spacing:.08em}.tool-table tr:last-child td{border-bottom:0}.tool-howto{padding:26px;border-radius:18px;margin:24px 0}.tool-howto h2{margin:0 0 12px;font-family:"Playfair Display",serif;font-size:1.4rem}.tool-howto ol{margin:0;padding-left:1.2em;line-height:1.75}.tool-related{margin-top:32px}.tool-related .section-title{font-size:1.4rem;margin:0 0 18px}.tool-single{padding:36px}.tool-single__head{margin-bottom:22px}.tool-single__icon{width:64px;height:64px;border-radius:16px;background:linear-gradient(135deg,rgba(15,98,254,.12),rgba(123,97,255,.12));color:var(--fpl-primary);display:inline-flex;align-items:center;justify-content:center;margin-bottom:10px}.tool-single__title{font-family:"Playfair Display",serif;font-size:clamp(1.7rem,3vw,2.2rem);margin:0 0 8px}.tool-single__lead{color:var(--fpl-ink-dim);margin:0 0 14px}