/* Tool pages need immediate visibility — scroll-reveal .rv hides content until observed */
body.tool-page .rv{opacity:1;transform:none}

/* Shared FileShot tool shell (matches video-downloader visual language) */
.vd-shell{
  border-radius:20px;border:1px solid var(--bdr);background:var(--bg2);
  box-shadow:0 8px 28px rgba(0,0,0,.28);overflow:hidden;
}
.vd-shell-pad{padding:1.45rem 1.35rem 1.2rem;background:var(--bg2)}
.vd-shell .pre-head{display:flex;gap:.85rem;align-items:flex-start;margin-bottom:1rem}
.vd-shell .pre-head .ico{
  width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  background:rgba(247,150,58,.12);border:1px solid rgba(247,150,58,.22);flex-shrink:0;
}
.vd-shell .pre-head .ico svg{width:20px;height:20px;stroke:var(--a,#f7963a);fill:none;stroke-width:1.8}
.vd-shell .pre-head h2{font-size:1.08rem;font-weight:700;margin-bottom:.3rem;color:var(--t1)}
.vd-shell .pre-head p{font-size:.83rem;color:var(--t2);line-height:1.45;margin-bottom:0}
.vd-shell input[type=text],.vd-shell input[type=url],.vd-shell input[type=number],.vd-shell textarea,.vd-shell select{
  width:100%;padding:.85rem 1rem;border-radius:12px;border:1px solid var(--bdr);
  background:var(--bg);color:var(--t1);font:inherit;font-size:.9rem;
}
.vd-shell input:focus,.vd-shell textarea:focus,.vd-shell select:focus{
  outline:none;border-color:rgba(247,150,58,.45);box-shadow:0 0 0 2px rgba(247,150,58,.1);
}
.vd-btn{
  padding:.72rem 1rem;border-radius:12px;border:1px solid var(--bdr);background:var(--sur);
  color:var(--t1);font:inherit;font-size:.84rem;font-weight:600;cursor:pointer;
}
.vd-btn-pri{border:none;background:linear-gradient(135deg,var(--a,#f7963a),#e85d04);color:#fff}
.vd-btn:disabled{opacity:.55;cursor:not-allowed}
.vd-drop{
  border:2px dashed var(--bdr);border-radius:16px;padding:2rem 1rem;text-align:center;
  background:var(--bg);cursor:pointer;transition:.15s;
}
.vd-drop:hover,.vd-drop.dragover{border-color:rgba(247,150,58,.45);background:rgba(247,150,58,.06)}
.tool-out{margin-top:1rem;padding:1rem;border-radius:12px;border:1px solid var(--bdr);background:var(--bg);font-size:.84rem;color:var(--t2);line-height:1.55;white-space:pre-wrap;word-break:break-word}
.tool-preview{margin-top:1rem;display:flex;justify-content:center;align-items:center;min-height:120px}
.tool-preview img,.tool-preview canvas{max-width:100%;border-radius:12px;border:1px solid var(--bdr)}
.tool-row{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:.75rem;align-items:center}
/* Inline controls — beat .tool-page input/select { width:100% } in styles.css */
.tool-page .vd-shell .tool-row input[type=text],
.tool-page .vd-shell .tool-row input[type=url],
.tool-page .vd-shell .tool-row input[type=number],
.tool-page .vd-shell .tool-row select{
  width:auto;flex:0 0 auto;max-width:none;box-sizing:border-box;
}
.tool-page .vd-shell .tool-row select{min-width:6.5rem;max-width:11rem}
.tool-page .vd-shell .tool-row label{
  display:inline-flex;align-items:center;gap:.35rem;white-space:nowrap;font-size:.78rem;color:var(--t2);
}
.tool-page .vd-shell .tool-row .vd-btn{flex-shrink:0;white-space:nowrap}
.tool-page .vd-shell .tool-row input[type=checkbox]{width:auto;margin:0 .25rem 0 0}
/* URL + button on one row */
.tool-action-row{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:.75rem;align-items:stretch}
.tool-page .vd-shell .tool-action-row input[type=text],
.tool-page .vd-shell .tool-action-row input[type=url]{
  flex:1 1 12rem;width:auto!important;min-width:0;max-width:none;
}
.tool-page .vd-shell .tool-action-row .vd-btn{flex:0 0 auto;align-self:stretch;white-space:nowrap}
/* Match .container max-width:960px — widgets must not bleed full viewport */
.fs-tool-widgets,
main > .fs-tool-widgets{
  width:100%;max-width:960px;margin:1.25rem auto 0;padding:0 1rem;box-sizing:border-box;
}
.tool-page .container > .fs-tool-widgets{
  max-width:100%;margin-top:1.25rem;padding:0;
}
.tool-page .container > .tool-info-grid,
.tool-page .container > .tool-seo-block{width:100%;box-sizing:border-box}
.bg-progress{margin-top:.65rem;height:8px;border-radius:999px;background:var(--bg);border:1px solid var(--bdr);overflow:hidden}
.bg-progress[hidden]{display:none!important}
.bg-progress > span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--a,#f7963a),#e85d04);transition:width .2s ease}
.tool-privacy-badge{
  display:inline-block;margin-top:.5rem;padding:.35rem .65rem;border-radius:999px;font-size:.72rem;font-weight:600;
  border:1px solid var(--bdr);color:var(--t2);background:var(--bg);
}
.tool-privacy-badge.local{border-color:rgba(34,197,94,.35);color:#86efac;background:rgba(34,197,94,.08)}
.tool-privacy-badge.server{border-color:rgba(250,106,42,.35);color:#fdba74;background:rgba(250,106,42,.08)}
.tool-info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem;margin-top:2rem}
.tool-info-card{padding:1.1rem 1rem;border-radius:14px;border:1px solid var(--bdr);background:var(--bg)}
.tool-info-card h3{font-size:.95rem;margin:0 0 .45rem;color:var(--t1)}
.tool-info-card p{font-size:.82rem;line-height:1.5;margin:0;color:var(--t2)}
.tool-seo-block{max-width:800px;margin:2.5rem auto 0;padding:0;line-height:1.7;color:var(--t2)}
.tool-seo-block h2{color:var(--t1);font-size:1.3rem;margin:0 0 1rem}
.tool-seo-block h3{color:var(--t1);font-size:1.05rem;margin:1.5rem 0 .65rem}
.tool-faq{margin-top:2rem}
.tool-faq details{border:1px solid var(--bdr);border-radius:12px;padding:.85rem 1rem;margin-bottom:.55rem;background:var(--bg)}
.tool-faq summary{cursor:pointer;font-weight:600;color:var(--t1);font-size:.9rem}
.tool-faq p{margin:.65rem 0 0;font-size:.85rem;line-height:1.55}
html.light-theme .vd-shell,[data-theme="light"] .vd-shell{box-shadow:0 4px 16px rgba(0,0,0,.06)}
/* Tools dropdown: bridge hover gap so menu does not vanish mid-travel */
.tool-page .nav-dd{padding-bottom:6px;margin-bottom:-6px}
.tool-page .nav-dd-menu{top:calc(100% - 2px)!important;transform:translateX(-50%)!important;transition:opacity .18s ease,visibility .18s ease!important}
.tool-page .nav-dd-menu::before{top:-14px;height:14px}
.tool-page .nav-dd:hover .nav-dd-menu,.tool-page .nav-dd:focus-within .nav-dd-menu{transform:translateX(-50%)!important}