@font-face {
    font-family: "PinnehTools";
    src: url("../fonts/vazirmatn/webfonts/Vazirmatn%5Bwght%5D.woff2") format("woff2");
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

.pn-tools {
    --tool-accent: var(--header-color2, #df2545);
    --tool-bg: var(--bg-color2, #fff);
    --tool-text: var(--text-color, #243147);
    --tool-muted: #697586;
    --tool-border: #e4e8ee;
    --tool-soft: #f7f8fb;
    --tool-tint: #fff4f5;
    max-width: 1200px;
    margin: 28px auto 72px;
    padding: 24px;
    color: var(--tool-text);
    font: 400 14px/1.85 "PinnehTools", sans-serif;
}
.pn-tools, .pn-tools * { box-sizing: border-box; }
.pn-tools [hidden] { display: none !important; }
.pn-tools h1, .pn-tools h2, .pn-tools h3 { color: inherit; font-family: inherit; }
.pn-tools p { color: inherit; line-height: 2; }
.pn-tools a { color: var(--tool-accent); text-decoration: none; }
.pn-tools a:focus-visible, .pn-tools button:focus-visible, .pn-tools summary:focus-visible {
    outline: 3px solid var(--tool-accent); outline-offset: 4px;
}
.pn-tools-hero { padding: 0 0 30px; }
.pn-tools-breadcrumb { display: flex; align-items: center; gap: 10px; color: var(--tool-muted); font-size: 12px; margin-bottom: 25px; }
.pn-tools-breadcrumb a { color: var(--tool-muted); }
.pn-tools-breadcrumb a:hover { color: var(--tool-accent); }
.pn-tools-heading { display: flex; align-items: flex-start; gap: 18px; }
.pn-tools-heading-icon {
    display: grid; place-items: center; flex: 0 0 58px; height: 58px;
    border: 1px solid #f9dbe0; border-radius: 18px; color: var(--tool-accent); background: var(--tool-tint);
}
.pn-tools-heading-icon svg { width: 26px; height: 26px; }
.pn-tools h1 { font-size: clamp(24px, 3vw, 34px); font-weight: 800; letter-spacing: -.7px; line-height: 1.6; margin: 0 0 8px; }
.pn-tools-heading p, .pn-tools-hero > p { color: var(--tool-muted); margin: 0; max-width: 780px; }
.pn-tools-eyebrow { color: var(--tool-accent); font-size: 12px; font-weight: 600; display: block; margin-bottom: 10px; }
.pn-tool-local { display: inline-flex; align-items: center; gap: 7px; color: var(--tool-muted); font-size: 12px; margin-top: 18px; }
.pn-tool-local::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #26967b; }

/* The input and result cards share one grid. Results remain visible on wide screens. */
.pn-tool-panel { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 20px; align-items: start; }
#tool-form, .pn-tool-results, #tool-output:empty, .pn-tool-guide {
    background: var(--tool-bg); border: 1px solid var(--tool-border); border-radius: 20px;
    box-shadow: 0 4px 24px #24314704;
}
#tool-form { grid-column: 1; grid-row: 1 / span 3; padding: 28px; margin: 0; min-width: 0; }
.pn-tool-form-heading { display: flex; align-items: center; gap: 12px; padding-bottom: 20px; margin-bottom: 24px; border-bottom: 1px solid var(--tool-border); }
.pn-tool-form-dot { width: 8px; height: 25px; border-radius: 5px; background: var(--tool-accent); }
.pn-tool-form-heading h2 { font-size: 16px; font-weight: 750; margin: 0; }
.pn-tool-form-heading p { color: var(--tool-muted); font-size: 11px; margin: 3px 0 0; }
.pn-tool-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 18px; align-items: start; }
.pn-tool-field { display: block; min-width: 0; margin: 0; }
.pn-tool-field > span, .pn-tools legend { display: block; font-size: 12px; font-weight: 650; line-height: 1.8; margin-bottom: 9px; }
.pn-tools input:not([type=checkbox]):not([type=radio]), .pn-tools select, .pn-tools textarea {
    width: 100%; min-height: 50px; padding: 12px 14px; margin: 0; border: 1px solid var(--tool-border);
    border-radius: 10px; background: var(--tool-soft); color: var(--tool-text); font: 450 14px/1.8 "PinnehTools", sans-serif;
    transition: border-color .15s, box-shadow .15s, background .15s;
}
.pn-tools select { padding-inline-end: 32px; cursor: pointer; }
.pn-tools input[inputmode=decimal], .pn-tools input[inputmode=numeric] { direction: ltr; text-align: right; font-variant-numeric: tabular-nums; }
.pn-tools input::placeholder, .pn-tools textarea::placeholder { color: #929cab; font-size: 12px; }
.pn-tools input:focus, .pn-tools select:focus, .pn-tools textarea:focus {
    border-color: var(--tool-accent); outline: 0; background: var(--tool-bg); box-shadow: 0 0 0 3px #df254512;
}
.pn-tools input[readonly] { color: var(--tool-muted); background: var(--tool-soft); border-style: dashed; }
.pn-tools textarea { min-height: 240px; resize: vertical; line-height: 2.1; }
.pn-tool-field small { display: block; color: var(--tool-muted); line-height: 1.9; font-size: 10px; margin-top: 8px; }
.pn-tool-wide { grid-column: 1 / -1; }
.pn-tools fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.pn-tools legend { float: none; width: auto; }
.pn-tool-choices { display: flex; flex-wrap: wrap; gap: 8px; }
.pn-tool-choice {
    position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 7px;
    padding: 9px 12px; min-height: 42px; border: 1px solid var(--tool-border); border-radius: 10px;
    background: var(--tool-bg); font-size: 11px; line-height: 1.7; cursor: pointer; transition: border-color .15s, background .15s;
}
.pn-tool-choice:hover { border-color: #e8a6b0; }
.pn-tool-choice:has(input:checked) { background: var(--tool-tint); color: var(--tool-accent); border-color: var(--tool-accent); font-weight: 650; }
.pn-tool-choice:focus-within { outline: 2px solid var(--tool-accent); outline-offset: 3px; }
.pn-tool-choice input { width: 14px; height: 14px; min-height: 0; margin: 0; flex-shrink: 0; accent-color: var(--tool-accent); }
.pn-tool-section-title { font-size: 13px; font-weight: 750; margin: 8px 0 -4px; padding-top: 20px; border-top: 1px solid var(--tool-border); }

/* Results and secondary actions. */
#tool-output { grid-column: 2; grid-row: 1; position: sticky; top: 24px; min-width: 0; }
#tool-output:empty { min-height: 205px; padding: 30px; background: var(--tool-soft); display: flex; flex-direction: column; justify-content: center; }
#tool-output:empty::before { content: "نتیجه شما"; font-size: 16px; font-weight: 750; margin-bottom: 10px; }
#tool-output:empty::after { content: "اطلاعات فرم را تکمیل کنید تا نتیجه در این بخش نمایش داده شود."; color: var(--tool-muted); font-size: 12px; line-height: 2; }
.pn-tool-results { border-top: 3px solid var(--tool-accent); padding: 26px 22px 22px; }
.pn-tool-results h2 { font-size: 12px; font-weight: 600; color: var(--tool-muted); margin: 0 0 12px; }
.pn-tools output { display: block; }
.pn-tool-value { color: var(--tool-text); font-size: clamp(23px, 2.5vw, 31px); font-weight: 800; line-height: 1.8; letter-spacing: -.6px; overflow-wrap: anywhere; white-space: pre-wrap; font-variant-numeric: tabular-nums; }
.pn-tool-results dl { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 0 12px; margin: 24px 0 0; }
.pn-tool-results dt, .pn-tool-results dd { font-size: 11px; padding: 12px 0; margin: 0; border-bottom: 1px solid var(--tool-border); line-height: 1.9; overflow-wrap: anywhere; }
.pn-tool-results dt { color: var(--tool-muted); font-weight: 400; }
.pn-tool-results dd { text-align: left; font-weight: 600; font-variant-numeric: tabular-nums; }
.pn-tool-note { color: var(--tool-muted) !important; font-size: 11px; line-height: 2; margin: 12px 0 0; }
.pn-tool-results > .pn-tool-note { padding: 14px; background: var(--tool-soft); border-radius: 10px; margin-top: 20px; }
.pn-tools button, .pn-tool-download {
    min-height: 42px; padding: 10px 15px; border: 1px solid var(--tool-border); border-radius: 10px;
    background: var(--tool-bg); color: var(--tool-text); font: 550 11px/1.8 "PinnehTools", sans-serif; cursor: pointer; transition: background .15s, border-color .15s;
}
.pn-tools button:hover { background: var(--tool-soft); border-color: #bcc4cf; }
.pn-tools button:disabled { opacity: .5; cursor: wait; }
.pn-tools .pn-tool-primary { color: white; background: var(--tool-accent); border-color: var(--tool-accent); }
.pn-tools .pn-tool-primary:hover { filter: brightness(.95); background: var(--tool-accent); border-color: var(--tool-accent); }
.pn-tool-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
.pn-tool-results .pn-tool-actions > button { flex: 1; }
.pn-tool-error { grid-column: 2; margin: 0; padding: 14px 16px; border: 1px solid #f4cad0; border-radius: 12px; background: #fff3f4; color: #ad1d38 !important; font-size: 12px; line-height: 2; }
#tool-status { grid-column: 2; margin: 0; color: var(--tool-muted); font-size: 12px; }
#tool-status:empty, .pn-tool-error[hidden] { display: none; }
.pn-tool-password { direction: ltr; user-select: all; font-family: monospace; letter-spacing: .05em; font-size: 24px; }

/* Explanations and optional settings. */
.pn-tool-guide { padding: 24px 28px; margin-top: 24px; }
.pn-tool-guide h2 { font-size: 15px; font-weight: 750; margin: 0 0 12px; }
.pn-tool-guide p { color: var(--tool-muted); font-size: 12px; margin: 0; }
.pn-tools details { border: 1px solid var(--tool-border); background: var(--tool-soft); border-radius: 12px; padding: 0 15px; margin: 0; min-width: 0; }
.pn-tools summary { padding: 14px 0; cursor: pointer; font-size: 11px; font-weight: 650; color: var(--tool-text); line-height: 1.9; }
.pn-tools details[open] { padding-bottom: 16px; }
.pn-tools details[open] > summary { border-bottom: 1px solid var(--tool-border); margin-bottom: 16px; }
#tool-output > details { margin-top: 14px; }
.pn-tool-related { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 30px; }
.pn-tool-related h2 { width: 100%; margin: 0 0 6px; font-size: 15px; font-weight: 750; }
.pn-tool-related a { color: var(--tool-muted); background: var(--tool-bg); padding: 8px 14px; border: 1px solid var(--tool-border); border-radius: 10px; font-size: 11px; }
.pn-tool-related a:hover { color: var(--tool-accent); border-color: var(--tool-accent); }
.pn-tool-table-wrap { max-height: 420px; overflow: auto; margin-top: 14px; border: 1px solid var(--tool-border); border-radius: 10px; }
.pn-tools table { width: 100%; border-collapse: collapse; text-align: right; background: var(--tool-bg); font-size: 11px; }
.pn-tools th, .pn-tools td { padding: 12px; border-bottom: 1px solid var(--tool-border); white-space: nowrap; }
.pn-tools th { background: var(--tool-soft); font-weight: 650; }
.pn-tools tbody tr:last-child td { border-bottom: 0; }

/* File tools use a full-width workspace for page previews and batch results. */
.pn-tool-panel:has(input[type=file]) { grid-template-columns: 1fr; }
.pn-tool-panel:has(input[type=file]) > #tool-form,
.pn-tool-panel:has(input[type=file]) > #tool-output,
.pn-tool-panel:has(input[type=file]) > #tool-error,
.pn-tool-panel:has(input[type=file]) > #tool-status { grid-column: 1; grid-row: auto; position: static; }
.pn-tool-panel:has(input[type=file]) > #tool-output:empty { display: none; }
.pn-tool-drop { padding: 26px; border: 1.5px dashed #bdc6d3; border-radius: 14px; text-align: center; background: var(--tool-soft); }
.pn-tool-drop > span { font-size: 13px; margin-bottom: 16px; }
.pn-tools .pn-tool-drop input { background: var(--tool-bg); font-size: 11px; }
.pn-tool-drop.is-dragging { border-color: var(--tool-accent); background: var(--tool-tint); }
.pn-tool-pages { display: grid; grid-template-columns: repeat(auto-fill, minmax(155px, 1fr)); gap: 14px; }
.pn-tool-page { background: var(--tool-bg); border: 1px solid var(--tool-border); border-radius: 14px; padding: 12px; text-align: center; }
.pn-tool-page canvas { display: block; max-width: 100%; height: auto; margin: 0 auto 10px; border-radius: 4px; }
.pn-tool-page p { font-size: 11px; color: var(--tool-muted); }
.pn-tool-page button { padding: 6px 8px; margin: 3px; min-width: 36px; font-size: 10px; }
.pn-tool-preview { max-width: 150px; max-height: 110px; object-fit: contain; border-radius: 8px; }
.pn-tool-file { display: flex; align-items: center; flex-wrap: wrap; gap: 16px; padding: 18px; margin-bottom: 10px; border: 1px solid var(--tool-border); border-radius: 14px; background: var(--tool-bg); }
.pn-tool-file p { flex: 1; min-width: 150px; margin: 0; font-size: 12px; }

/* Catalog. */
.pn-tools-hero > label { display: block; margin-top: 24px; font-size: 12px; font-weight: 600; }
.pn-tools-hero > input { max-width: 540px; margin-top: 8px !important; background: var(--tool-bg) !important; }
.pn-tools-category { margin: 8px 0 32px; }
.pn-tools-category > h2 { display: flex; align-items: center; gap: 10px; font-size: 17px; font-weight: 750; margin: 0 0 16px; }
.pn-tools-count { color: var(--tool-muted); font-size: 11px; font-weight: 500; border: 1px solid var(--tool-border); border-radius: 7px; padding: 1px 7px; }
.pn-tools-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; }
.pn-tool-card { display: flex; flex-direction: column; align-items: flex-start; padding: 23px; border: 1px solid var(--tool-border); border-radius: 16px; background: var(--tool-bg); color: var(--tool-text) !important; transition: transform .15s, box-shadow .15s, border-color .15s; }
.pn-tool-card:hover { transform: translateY(-3px); box-shadow: 0 10px 25px #24314709; border-color: #e9b5bf; }
.pn-tool-card-icon { display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: var(--tool-tint); color: var(--tool-accent); }
.pn-tool-card h3 { font-size: 15px; font-weight: 700; line-height: 1.9; margin: 15px 0 8px; }
.pn-tool-card p { font-size: 11px; color: var(--tool-muted); margin: 0 0 18px; }
.pn-tool-open { font-size: 11px; font-weight: 600; color: var(--tool-accent); margin-top: auto; }

[data-theme="dark"] .pn-tools { --tool-bg: #1f242d; --tool-text: #f1f3f7; --tool-accent: #ff8297; --tool-border: #3a3f49; --tool-soft: #252a33; --tool-tint: #38252d; --tool-muted: #b1bac8; }
[data-theme="dark"] .pn-tools-heading-icon { border-color: #60303e; }
[data-theme="dark"] .pn-tool-error { background: #3c242b; border-color: #763845; color: #ffb9c5 !important; }
[data-theme="dark"] .pn-tools .pn-tool-primary { color: #fff; background: #d71938; border-color: #d71938; }

@media (max-width: 960px) {
    .pn-tool-panel { grid-template-columns: 1fr; }
    #tool-form, #tool-output, .pn-tool-error, #tool-status { grid-column: 1; grid-row: auto; position: static; }
    .pn-tools-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
    .pn-tools { padding: 16px; margin: 16px auto 45px; }
    .pn-tools-hero { padding-bottom: 22px; }
    .pn-tools-breadcrumb { font-size: 10px; margin-bottom: 18px; gap: 7px; }
    .pn-tools-heading { gap: 12px; }
    .pn-tools-heading-icon { flex-basis: 44px; height: 44px; border-radius: 13px; }
    .pn-tools-heading-icon svg { width: 22px; height: 22px; }
    .pn-tools h1 { font-size: 23px; }
    .pn-tools-heading p { font-size: 12px; }
    .pn-tool-local { font-size: 10px; }
    #tool-form { padding: 20px 17px; }
    .pn-tool-fields { grid-template-columns: 1fr; gap: 20px; }
    .pn-tool-choice { padding: 9px 11px; }
    .pn-tool-form-heading { padding-bottom: 16px; margin-bottom: 21px; }
    .pn-tool-results { padding: 22px 18px 18px; }
    .pn-tool-value { font-size: 28px; }
    .pn-tool-guide { padding: 21px 18px; }
    .pn-tools-grid { grid-template-columns: 1fr; }
    .pn-tool-drop { padding: 20px 13px; }
    .pn-tool-file { padding: 14px; }
}
@media (prefers-reduced-motion: reduce) {
    .pn-tools *, .pn-tools *::before, .pn-tools *::after { transition: none !important; }
}
.pn-tools .pn-qibla-compass {position:relative;margin-top:18px;padding:22px 18px;background:var(--tool-bg,transparent);border:1px solid var(--tool-border,#e4e8ee);border-radius:18px;text-align:center}
.pn-tools .pn-qibla-compass svg {display:block;width:min(100%,320px);height:auto;margin:0 auto;overflow:visible}
.pn-tools .pn-qibla-face {fill:var(--tool-soft,#f7f8fb);stroke:var(--tool-border,#e4e8ee);stroke-width:2}
.pn-tools .pn-qibla-ticks {stroke:currentColor;opacity:.35;stroke-width:1.5}
.pn-tools .pn-qibla-labels {fill:currentColor;font-size:13px;text-anchor:middle;font-family:inherit}
.pn-tools .pn-qibla-north {fill:var(--tool-accent,#d71938);font-weight:700}
.pn-tools .pn-qibla-arrow {fill:var(--tool-accent,#d71938)}
.pn-tools .pn-qibla-kaaba {fill:#232b36}
.pn-tools .pn-qibla-gold {stroke:#eac46a;stroke-width:3}
.pn-tools .pn-qibla-centre {fill:currentColor}
.pn-tools .pn-qibla-top {display:block;color:var(--tool-accent,#d71938);font-size:20px;line-height:1;margin-bottom:8px}
.pn-tools .pn-qibla-compass.is-aligned {border-color:#198754}
.pn-tools .pn-qibla-compass.is-aligned .pn-qibla-arrow {fill:#198754}
.pn-tools .pn-qibla-compass.is-aligned [data-qibla-hint] {color:#198754;font-weight:700}
.pn-tools [data-qibla-hint] {min-height:3em;font-size:14px;line-height:1.9}
.pn-tools .pn-ocr-preview {padding:18px;border:1px solid var(--tool-border);border-radius:16px;background:var(--tool-soft);text-align:center}
.pn-tools .pn-ocr-preview img {display:block;max-width:100%;max-height:280px;object-fit:contain;margin:auto}
.pn-tools .pn-ocr-preview p {overflow-wrap:anywhere;font-size:12px;color:var(--tool-muted);margin-bottom:0}
.pn-tools .pn-ocr-result textarea {min-height:300px;line-height:2;font-size:16px;resize:vertical;unicode-bidi:plaintext}
.pn-tools [data-ocr-progress] {width:100%;height:12px;accent-color:var(--tool-accent)}
.pn-tools .pn-tool-drop.is-dragover {border-color:var(--tool-accent);background:var(--tool-tint)}

/* Shared tool forms: neutral surfaces and red accents in both themes. */
.pn-tools.pn-tool-detail {width:100%;min-width:0;max-width:1640px;padding:24px 36px;--tool-accent:#ed0028;--tool-tint:#fff5f5;--tool-bg:#fff;--tool-soft:#fafafa;--tool-text:#151c2b;--tool-muted:#657084;--tool-border:#dfe3eb}
.pn-tool-detail .pn-tools-hero {padding-bottom:22px}
.pn-tool-detail .pn-tools-heading-icon {width:72px;height:72px;flex-basis:72px;border-color:#f0d9dc;background:#fff6f6;border-radius:16px;color:#ed0028}
.pn-tool-detail .pn-tools-heading-icon svg {width:40px;height:40px}
.pn-tool-detail h1 {font-size:clamp(26px,3vw,42px)}
.pn-tool-detail .pn-tools-heading p {font-size:15px}
.pn-tool-detail .pn-tool-local {padding:8px 18px;border:1px solid #d9eee6;border-radius:15px;background:#f1faf6;color:#315b4c;font-size:12px}
.pn-tool-detail .pn-tool-panel {grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:16px}
.pn-tool-detail #tool-form {padding:28px;border-radius:20px;box-shadow:none}
.pn-tool-detail .pn-tool-form-heading {border:0;padding-bottom:0;margin-bottom:28px}
.pn-tool-detail .pn-tool-form-heading h2 {font-size:23px;font-weight:800}
.pn-tool-detail .pn-tool-form-heading p {font-size:12px}
.pn-tool-detail .pn-tool-form-dot {height:29px;width:5px;background:#ed0028}
.pn-tool-detail .pn-tool-fields {gap:22px 20px}
.pn-tool-detail .pn-tool-field > span,.pn-tool-detail legend {font-size:14px;font-weight:550}
.pn-tools.pn-tool-detail input:not([type=checkbox]):not([type=radio]),.pn-tools.pn-tool-detail select,.pn-tools.pn-tool-detail textarea {min-height:54px;border-radius:13px;background:var(--tool-bg);font-size:16px;border-color:var(--tool-border)}
.pn-tool-detail .pn-tool-field small {font-size:11px}
.pn-tool-detail .pn-tool-choice {font-size:14px;min-height:44px;border-radius:12px;padding:9px 20px}
.pn-tool-detail .pn-tool-choice:has(input:checked) {background:#ed0028;border-color:#ed0028;color:#fff}
.pn-tool-detail .pn-tool-choice input {accent-color:#ed0028}
.pn-tool-detail .pn-tool-choice:has(input:checked) input {accent-color:#fff}
.pn-tool-detail .pn-tool-results {padding:30px;border:1px solid #eadbde;border-radius:20px;background:linear-gradient(135deg,#fff6f6,#fff);box-shadow:none}
.pn-tool-detail .pn-tool-results h2 {font-size:19px;font-weight:750;color:var(--tool-text);margin-bottom:22px}
.pn-tool-detail .pn-tool-value {font-size:clamp(27px,3vw,44px);color:#ed0028;line-height:1.7}
.pn-tool-detail .pn-tool-results dl {padding:4px 16px;background:var(--tool-bg);border-radius:15px;margin-top:24px}
.pn-tool-detail .pn-tool-results dt,.pn-tool-detail .pn-tool-results dd {font-size:13px;padding:17px 0}
.pn-tool-detail .pn-tool-results dt:last-of-type,.pn-tool-detail .pn-tool-results dd:last-of-type {border-bottom:0}
.pn-tool-detail button {font-size:13px;min-height:46px;border-radius:13px}
.pn-tool-detail .pn-tool-results .pn-tool-actions button {border-color:var(--tool-accent);color:var(--tool-accent);background:var(--tool-bg)}
.pn-tool-detail #tool-output:empty {background:var(--tool-soft);min-height:240px;border-radius:20px}
.pn-tool-detail .pn-tool-guide {box-shadow:none}
[data-theme=dark] .pn-tools.pn-tool-detail {--tool-bg:#20242c;--tool-soft:#262b34;--tool-text:#f1f3f7;--tool-muted:#b5bdca;--tool-border:#414752;--tool-accent:#ff334c;--tool-tint:#302326}
[data-theme=dark] .pn-tool-detail .pn-tools-heading-icon {background:#302326;border-color:#583039;color:#ff334c}
[data-theme=dark] .pn-tool-detail .pn-tool-results {background:linear-gradient(135deg,#2c2328,#20242c);border-color:#50353d}
[data-theme=dark] .pn-tool-detail .pn-tool-value {color:#ff334c}
[data-theme=dark] .pn-tool-detail .pn-tool-local {background:#202e28;border-color:#365345;color:#b2d8c2}
[data-theme=dark] .pn-tool-detail .pn-tool-choice:has(input:checked),[data-theme=dark] .pn-tool-detail .pn-tool-primary {background:#df0026;border-color:#df0026;color:#fff}
@media(max-width:960px) {.pn-tool-detail .pn-tool-panel {grid-template-columns:1fr}}
@media(max-width:600px) {.pn-tools.pn-tool-detail {padding:16px}.pn-tool-detail #tool-form,.pn-tool-detail .pn-tool-results {padding:20px 17px}.pn-tool-detail .pn-tools-heading-icon {width:48px;height:48px;flex-basis:48px}.pn-tool-detail .pn-tools-heading-icon svg {width:28px;height:28px}.pn-tool-detail .pn-tools-heading p {font-size:12px}.pn-tool-detail .pn-tool-form-heading h2 {font-size:20px}.pn-tool-detail .pn-tool-choice {font-size:12px;padding:8px 13px}.pn-tool-detail .pn-tool-results dt,.pn-tool-detail .pn-tool-results dd {font-size:12px}}
.pn-tool-detail .pn-tool-panel:has(input[type=file]) {grid-template-columns:1fr}