/* 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:not(.quality-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:not(.quality-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)}
/* Split-card layout (video-downloader / QR generator) */
.vd-shell-split{
  display:grid;grid-template-columns:1fr 236px;align-items:start;padding:0;
}
.vd-shell-split .vd-main{padding:1.45rem 1.35rem 1.2rem;display:flex;flex-direction:column;min-width:0;background:var(--bg2)}
.vd-shell-split .vd-side{
  padding:1.15rem .95rem;background:var(--bg);border-left:1px solid var(--bdr);
  display:flex;flex-direction:column;min-height:100%;
}
.vd-shell-split .vd-side .side-h{font-size:.64rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--t3);margin-bottom:.55rem}
.vd-shell-split .qr-preview-panel{
  flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  min-height:220px;padding:.5rem 0;
}
.vd-shell-split .qr-preview-panel .tool-preview{margin-top:0;min-height:180px;width:100%}
.vd-shell-split .vd-side .vd-btn{width:100%;margin-top:.65rem}
.qr-field-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;margin-bottom:.85rem}
.qr-field-grid label{font-size:.72rem;color:var(--t3);display:block}
.qr-field-grid input,.qr-field-grid select{margin-top:.35rem}
@media(max-width:768px){
  .vd-shell-split{grid-template-columns:1fr}
  .vd-shell-split .vd-side{border-left:none;border-top:1px solid var(--bdr)}
}
/* 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}