/* Shared styles for standalone Toolora text tools. */
.tool-wrap{max-width:1000px;margin:0 auto;padding:34px 22px 54px}
.crumbs{display:flex;gap:9px;align-items:center;flex-wrap:wrap;color:var(--muted);font-size:.92rem;margin-bottom:18px}
.crumbs a{color:var(--blue)}
.tool-panel{background:#fff;border:1px solid var(--line);border-radius:20px;padding:clamp(22px,4vw,36px);box-shadow:0 8px 26px #17203308}
.tool-panel h1{font-size:clamp(2rem,4vw,2.8rem);line-height:1.12;letter-spacing:-.045em;margin:8px 0 10px;color:var(--ink)}
.tool-intro{color:#526078;line-height:1.75;margin:0 0 25px;max-width:760px}
.tool-fields{display:flex;flex-direction:column;gap:13px}
.field-label{display:block;font-weight:700;color:#344054;font-size:.92rem;margin:0 0 7px}
.tool-textarea,.tool-input,.tool-select{display:block;width:100%;min-width:0;border:1px solid #d8e0ec;background:#fff;border-radius:11px;padding:13px 14px;font:inherit;color:var(--ink);line-height:1.55;outline:none;transition:border-color .15s,box-shadow .15s}
.tool-textarea{resize:vertical;min-height:115px}
.tool-textarea:focus,.tool-input:focus,.tool-select:focus{border-color:#84a9ff;box-shadow:0 0 0 3px #155eef18}
.result-textarea{background:#f8faff}
.tool-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.tool-button{border:0;border-radius:10px;background:var(--blue);color:#fff;padding:11px 17px;font:inherit;font-weight:700;font-size:.94rem;cursor:pointer;min-height:43px}
.tool-button:hover{filter:brightness(.96)}.tool-button:focus-visible{outline:3px solid #93b4ff;outline-offset:3px}
.tool-button.secondary{background:#edf3ff;color:var(--blue)}
.tool-note,.live-hint{font-size:.86rem;color:var(--muted);line-height:1.65;margin:18px 0 0}
.metric-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:16px}
.metric-grid--four{grid-template-columns:repeat(4,minmax(0,1fr))}.metric-grid--three{grid-template-columns:repeat(3,minmax(0,1fr))}
.metric-card{padding:15px;background:#f4f7ff;border:1px solid #e5edff;border-radius:12px;min-width:0}
.metric-card span{display:block;color:#667085;font-size:.82rem;line-height:1.35}.metric-card strong{display:block;margin-top:5px;font-size:1.55rem;line-height:1.25;color:#173f91;overflow-wrap:anywhere}
.check-label{display:flex;gap:9px;align-items:center;color:#475467;font-size:.9rem}.check-label input{width:17px;height:17px;accent-color:var(--blue)}
.control-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.tool-output{display:block;margin-top:16px;padding:14px 16px;background:#f4f7ff;color:#203f7f;border-radius:11px;white-space:pre-wrap;overflow-wrap:anywhere;min-height:48px;line-height:1.6}
.tool-nav{display:flex;gap:10px 18px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:17px;margin-top:25px;font-size:.9rem}
.tool-nav a{font-weight:700}
.compare-inputs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.diff-legend{display:flex;gap:16px;flex-wrap:wrap;margin:17px 0 12px;color:#667085;font-size:.84rem}.diff-legend span{display:flex;align-items:center;gap:7px}.diff-dot{display:inline-block;width:10px;height:10px;border-radius:50%}.diff-dot.added{background:#20a464}.diff-dot.removed{background:#d84b4b}.diff-dot.same{background:#98a2b3}
.comparison-results{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:14px}.comparison-results[hidden]{display:none}.comparison-results section{border:1px solid var(--line);border-radius:12px;overflow:hidden;min-width:0}.comparison-results h3{font-size:.95rem;margin:0;padding:11px 13px;background:#f8faff;border-bottom:1px solid var(--line)}
.diff-lines{padding:8px;max-height:380px;overflow:auto;font: .84rem/1.6 ui-monospace,SFMono-Regular,Consolas,monospace;white-space:pre-wrap;overflow-wrap:anywhere}.diff-line{display:block;padding:3px 7px;border-radius:5px;margin:2px 0;min-height:1.7em}.diff-line.added{background:#e8f8ef;color:#145b36}.diff-line.removed{background:#fff0f0;color:#8d2424}.diff-line.same{color:#475467}.diff-line .prefix{display:inline-block;width:1.2em;font-weight:800;user-select:none}
.directory-wrap{max-width:1160px;margin:0 auto;padding:38px 22px 60px}.directory-hero{padding:34px;border-radius:20px;background:linear-gradient(120deg,#102a56,#155eef);color:#fff;margin-bottom:30px}.directory-hero .eyebrow{color:#dbe7ff}.directory-hero h1{font-size:clamp(2rem,4vw,3rem);line-height:1.1;letter-spacing:-.04em;margin:10px 0}.directory-hero p{color:#e2ebff;max-width:700px;margin:0}.tool-search{display:block;width:min(520px,100%);margin-top:22px;padding:13px 15px;border:1px solid #d7e1f5;border-radius:10px;font:inherit;color:var(--ink)}
.directory-heading{display:flex;align-items:end;justify-content:space-between;gap:14px;margin:28px 0 16px}.directory-heading h2{margin:0;font-size:1.55rem}.directory-heading p{margin:4px 0 0;color:var(--muted)}.directory-count{color:var(--muted);font-size:.9rem;white-space:nowrap}
.text-tool-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.text-tool-card{background:#fff;border:1px solid var(--line);border-radius:15px;padding:20px;min-width:0;display:flex;flex-direction:column;transition:transform .15s,border-color .15s,box-shadow .15s}.text-tool-card:hover{transform:translateY(-2px);border-color:#b9ccff;box-shadow:0 10px 25px #155eef12}.text-tool-icon{display:grid;place-items:center;width:40px;height:40px;border-radius:11px;background:#edf3ff;color:var(--blue);font-weight:800}.text-tool-card h3{font-size:1.05rem;margin:13px 0 6px}.text-tool-card p{color:var(--muted);font-size:.92rem;line-height:1.55;margin:0 0 16px;flex:1}.text-tool-card a{font-weight:750}.text-tool-card[hidden]{display:none}.directory-empty{color:var(--muted);padding:20px 0}
@media(max-width:820px){.text-tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.metric-grid--four{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.tool-wrap,.directory-wrap{padding:24px 15px 40px}.tool-panel{padding:20px 16px}.metric-grid,.metric-grid--three,.metric-grid--four{grid-template-columns:repeat(2,minmax(0,1fr))}.compare-inputs,.comparison-results,.control-grid{grid-template-columns:1fr}.directory-hero{padding:25px 19px}.text-tool-grid{grid-template-columns:1fr}.directory-heading{align-items:flex-start;flex-direction:column}}
