:root{
  --tdh-bg:#020a13;--tdh-panel:#061a2c;--tdh-panel2:#08192f;
  --tdh-line:#174967;--tdh-cyan:#36dcff;--tdh-blue:#168cff;
  --tdh-violet:#9158ff;--tdh-pink:#f04ce1;--tdh-green:#22e39b;
  --tdh-text:#f7fbff;--tdh-muted:#a4b5c8;
}
html{background:var(--tdh-bg);scroll-behavior:smooth}
body{
  margin:0;color:var(--tdh-text)!important;
  background:
    radial-gradient(circle at 7% 0,rgba(0,154,255,.13),transparent 31%),
    radial-gradient(circle at 95% 4%,rgba(120,72,255,.13),transparent 34%),
    #020a13!important;
}
body:before{
  content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;
  background-image:linear-gradient(rgba(64,154,220,.022) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(64,154,220,.022) 1px,transparent 1px);
  background-size:42px 42px
}
.tdh-final-page{width:min(1240px,calc(100% - 34px));margin:auto}
.tdh-final-nav{
  height:74px;display:flex;align-items:center;justify-content:space-between;gap:24px;
  border-bottom:1px solid rgba(75,159,221,.20)
}
.tdh-final-brand{display:flex;align-items:center;gap:9px;color:#fff;text-decoration:none;font-weight:900;font-size:20px}
.tdh-final-brand img{width:29px;height:29px;object-fit:contain}
.tdh-final-brand span span{color:var(--tdh-cyan)}
.tdh-final-links{display:flex;align-items:center;gap:28px}
.tdh-final-links a{color:#d7e1ec;text-decoration:none;font-size:13px}
.tdh-final-links a:hover{color:#fff}
.tdh-final-crumb{padding:19px 0 14px;color:#8fa7bf;font-size:13px}
.tdh-final-crumb a{color:#39d9ff;text-decoration:none}
.tdh-final-hero{
  display:flex;align-items:center;gap:22px;padding:26px;
  border:1px solid var(--tdh-line);border-radius:20px;
  background:linear-gradient(135deg,#071d32,#08192e 68%,#17153a);
  box-shadow:0 18px 45px rgba(0,0,0,.20)
}
.tdh-final-icon{
  width:78px;height:78px;flex:0 0 78px;display:grid;place-items:center;
  border:1px solid #1877b0;border-radius:18px;
  background:linear-gradient(145deg,#0b4f79,#29205f);
  box-shadow:0 0 30px rgba(26,165,255,.10);font-size:37px
}
.tdh-final-hero h1{
  margin:0 0 8px;font-size:clamp(30px,4vw,43px);line-height:1.03;letter-spacing:-.035em;
  background:linear-gradient(90deg,#fff,#59e5ff 57%,#8f65ff);
  -webkit-background-clip:text;background-clip:text;color:transparent
}
.tdh-final-hero p{margin:0;color:#a8b9cb;font-size:15px;line-height:1.6}
.tdh-final-pills{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.tdh-final-pill{
  padding:6px 10px;border-radius:999px;border:1px solid rgba(51,202,255,.28);
  background:#062238;color:#dff9ff;font-size:11px;font-weight:700
}
.tdh-final-work{
  margin-top:16px;padding:20px;border:1px solid var(--tdh-line);border-radius:20px;
  background:linear-gradient(150deg,#06182a,#071a31);
  box-shadow:0 18px 45px rgba(0,0,0,.20)
}
.tdh-final-work-title{display:flex;align-items:center;gap:10px;margin:0 0 18px;font-size:17px}
.tdh-final-work-title b{
  width:30px;height:30px;display:grid;place-items:center;border-radius:9px;
  border:1px solid #17699b;background:#0a3554
}
.tdh-final-original{width:100%}
.tdh-final-original .tool-brand-top,
.tdh-final-original > .back,
.tdh-final-original > .back-link,
.tdh-final-original .container > .back,
.tdh-final-original .compress-shell > .back-link,
.tdh-final-original .age-shell > .back-link{display:none!important}

/* Hide ONLY old duplicated top branding/hero elements. Functional controls remain visible. */
.tdh-final-original .card > .tool-brand-top,
.tdh-final-original .card > .icon,
.tdh-final-original .card > h1,
.tdh-final-original .card > .description,
.tdh-final-original .compress-card > .tool-brand-top,
.tdh-final-original .compress-card > .hero-icon,
.tdh-final-original .compress-card > h1.title,
.tdh-final-original .compress-card > .subtitle,
.tdh-final-original .age-card > .tool-brand-top,
.tdh-final-original .age-card > .hero-icon,
.tdh-final-original .age-card > h1,
.tdh-final-original .age-card > .subtitle{display:none!important}

/* Prevent repeated generic "How to use / Why use" blocks because Final adds one clean set below. */
.tdh-final-original .tdh-premium-steps,
.tdh-final-original .tdh-premium-why,
.tdh-final-original .tdh-master-how,
.tdh-final-original .how-section,
.tdh-final-original .why-box{display:none!important}

/* Remove legacy page-shell spacing, but retain all working controls and result boxes. */
.tdh-final-original .container,
.tdh-final-original .compress-shell,
.tdh-final-original .age-shell,
.tdh-final-original .tool-shell{
  max-width:none!important;width:100%!important;margin:0!important;padding:0!important
}
.tdh-final-original .card,
.tdh-final-original .compress-card,
.tdh-final-original .age-card{
  max-width:none!important;width:100%!important;margin:0!important;padding:0!important;
  border:0!important;background:transparent!important;box-shadow:none!important
}
.tdh-final-original input:not([type=checkbox]):not([type=radio]),
.tdh-final-original textarea,
.tdh-final-original select{
  box-sizing:border-box!important;background:#02111e!important;color:#fff!important;
  border:1px solid #1a5379!important;border-radius:11px!important
}
.tdh-final-original textarea{min-height:180px}
.tdh-final-original button,
.tdh-final-original .btn,
.tdh-final-original .calculate-btn,
.tdh-final-original .convert-btn,
.tdh-final-original .compress-btn,
.tdh-final-original .download-btn,
.tdh-final-original .clear-btn,
.tdh-final-original .action-btn{
  color:#fff!important;border:0!important;border-radius:11px!important;
  background:linear-gradient(90deg,#168cff,#28c9ff 55%,#974cff)!important;
  box-shadow:0 9px 25px rgba(24,141,255,.18)!important
}
.tdh-final-original .result-box,
.tdh-final-original .result,
.tdh-final-original .file-info,
.tdh-final-original .settings,
.tdh-final-original .drop-zone{
  border-color:#174764!important;background:#041525!important;border-radius:13px!important
}
.tdh-final-quick{
  display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:16px
}
.tdh-final-quick div{
  padding:13px;text-align:center;border:1px solid #153f5e;border-radius:12px;
  background:#06182a;color:#c5d6e5;font-size:12px
}
.tdh-final-guides{
  display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:14px 0 28px
}
.tdh-final-guide{
  padding:20px;border:1px solid var(--tdh-line);border-radius:18px;
  background:linear-gradient(145deg,#071b30,#08162c)
}
.tdh-final-guide h2{margin:0 0 13px;font-size:16px;color:#fff}
.tdh-final-guide ul{list-style:none;padding:0;margin:0}
.tdh-final-guide li{position:relative;padding-left:25px;margin:10px 0;color:#a4b5c9;font-size:13px;line-height:1.55}
.tdh-final-guide li:before{content:"✓";position:absolute;left:0;color:var(--tdh-green);font-weight:900}
.tdh-final-original .seo-content,
.tdh-final-original .faq-section,
.tdh-final-original .lower-grid{
  margin-top:15px!important;border:1px solid var(--tdh-line)!important;border-radius:18px!important;
  background:#06182a!important;padding:20px!important
}
.tdh-final-original .seo-content h2,
.tdh-final-original .faq-section h2{color:#fff!important}
.tdh-final-original .seo-content p,
.tdh-final-original .faq-section p{color:#a4b5c9!important}
@media(max-width:800px){
  .tdh-final-links{display:none}.tdh-final-guides,.tdh-final-quick{grid-template-columns:1fr}
  .tdh-final-hero{align-items:flex-start}.tdh-final-icon{width:62px;height:62px;flex-basis:62px;font-size:31px}
}
@media(max-width:520px){
  .tdh-final-page{width:min(100% - 22px,1240px)}.tdh-final-hero{padding:20px}.tdh-final-work{padding:15px}
}



/* =========================================================
   CATEGORY TOOL LIST — HOMEPAGE-MATCHED FUTURISTIC CARDS
   ========================================================= */
body.tdh-category-page .cat-shell,
body.tdh-category-page main,
body.tdh-category-page .tools-section,
body.tdh-category-page .tools-container{
  width:min(1380px,calc(100% - 34px))!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

body.tdh-category-page .cat-hero{
  margin-top:20px!important;
  padding:32px!important;
  border:1px solid rgba(70,170,255,.22)!important;
  border-radius:22px!important;
  background:
    radial-gradient(circle at 86% 10%,rgba(126,77,255,.13),transparent 30%),
    linear-gradient(145deg,rgba(7,27,46,.96),rgba(5,16,31,.98))!important;
  box-shadow:0 22px 58px rgba(0,0,0,.24)!important;
}
body.tdh-category-page .cat-hero h1{
  margin-bottom:10px!important;
  background:linear-gradient(90deg,#ffffff,#59e5ff 52%,#8d63ff 82%)!important;
  -webkit-background-clip:text!important;
  background-clip:text!important;
  color:transparent!important;
  letter-spacing:-.035em!important;
}
body.tdh-category-page .cat-hero p{
  color:#9fb4c9!important;
  max-width:760px!important;
  line-height:1.7!important;
}

body.tdh-category-page .search-row,
body.tdh-category-page .toolbar,
body.tdh-category-page .tools-toolbar{
  gap:12px!important;
  margin:18px 0 24px!important;
}
body.tdh-category-page .search-box,
body.tdh-category-page .sort-box,
body.tdh-category-page .count-box,
body.tdh-category-page .tool-count{
  border:1px solid rgba(67,166,239,.23)!important;
  border-radius:14px!important;
  background:rgba(5,20,35,.86)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 12px 30px rgba(0,0,0,.14)!important;
}

body.tdh-category-page .tool-grid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:18px!important;
  align-items:stretch!important;
  margin-top:8px!important;
}

body.tdh-category-page .tool-grid .tool-card{
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  min-width:0!important;
  min-height:300px!important;
  height:100%!important;
  padding:20px!important;
  border:1px solid rgba(74,166,248,.20)!important;
  border-radius:20px!important;
  background:
    radial-gradient(circle at 86% 8%,rgba(112,70,255,.10),transparent 34%),
    linear-gradient(155deg,rgba(8,29,50,.97),rgba(3,14,27,.99))!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 18px 46px rgba(0,0,0,.22)!important;
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease!important;
}

body.tdh-category-page .tool-grid .tool-card::before{
  content:""!important;
  position:absolute!important;
  left:0!important;right:0!important;top:0!important;
  height:2px!important;
  background:linear-gradient(90deg,#168cff,#34dcff,#8f5cff,#ef59dd)!important;
  opacity:.9!important;
}

body.tdh-category-page .tool-grid .tool-card::after{
  content:""!important;
  position:absolute!important;
  width:150px!important;height:150px!important;
  right:-75px!important;top:-80px!important;
  border-radius:50%!important;
  background:radial-gradient(circle,rgba(52,194,255,.12),transparent 68%)!important;
  pointer-events:none!important;
  z-index:-1!important;
}

body.tdh-category-page .tool-grid .tool-card:hover{
  transform:translateY(-7px)!important;
  border-color:rgba(63,211,255,.42)!important;
  box-shadow:
    0 26px 60px rgba(0,0,0,.31),
    0 0 34px rgba(41,168,255,.08)!important;
}

body.tdh-category-page .tool-grid .tool-icon{
  width:56px!important;
  height:56px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:15px!important;
  border:1px solid rgba(71,190,255,.28)!important;
  background:linear-gradient(145deg,rgba(27,143,255,.24),rgba(132,77,255,.19))!important;
  box-shadow:0 0 28px rgba(35,169,255,.09)!important;
  font-size:27px!important;
  margin-bottom:17px!important;
}

body.tdh-category-page .tool-grid .tool-card h3{
  margin:0 0 10px!important;
  font-size:18px!important;
  line-height:1.28!important;
  color:#f7fbff!important;
  letter-spacing:-.018em!important;
}

body.tdh-category-page .tool-grid .tool-card p{
  color:#91a8c0!important;
  line-height:1.62!important;
  font-size:13px!important;
  margin-bottom:15px!important;
}

body.tdh-category-page .tool-grid .tool-card .tool-meta,
body.tdh-category-page .tool-grid .tool-card .meta,
body.tdh-category-page .tool-grid .tool-card .badges{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:7px!important;
  margin-top:auto!important;
  margin-bottom:13px!important;
}

body.tdh-category-page .tool-grid .tool-card .tool-meta span,
body.tdh-category-page .tool-grid .tool-card .meta span,
body.tdh-category-page .tool-grid .tool-card .badge,
body.tdh-category-page .tool-grid .tool-card .free-badge{
  padding:5px 8px!important;
  border-radius:999px!important;
  border:1px solid rgba(74,174,255,.18)!important;
  background:rgba(5,24,41,.82)!important;
  color:#a9c0d6!important;
  font-size:10px!important;
  font-weight:700!important;
}

body.tdh-category-page .tool-grid .tool-open-link,
body.tdh-category-page .tool-grid .open-tool,
body.tdh-category-page .tool-grid .tool-btn{
  display:block!important;
  width:100%!important;
  box-sizing:border-box!important;
  margin-top:auto!important;
  padding:11px 13px!important;
  text-align:center!important;
  text-decoration:none!important;
  border-radius:11px!important;
  color:#fff!important;
  font-weight:800!important;
  font-size:12px!important;
  border:1px solid rgba(119,215,255,.22)!important;
  background:linear-gradient(95deg,#168cff,#27c9ff 54%,#8f57ff)!important;
  box-shadow:0 10px 24px rgba(23,139,255,.18)!important;
  transition:transform .2s ease,filter .2s ease,box-shadow .2s ease!important;
}

body.tdh-category-page .tool-grid .tool-open-link:hover,
body.tdh-category-page .tool-grid .open-tool:hover,
body.tdh-category-page .tool-grid .tool-btn:hover{
  transform:translateY(-2px)!important;
  filter:brightness(1.08)!important;
  box-shadow:0 13px 30px rgba(23,139,255,.24)!important;
}

body.tdh-category-page .tool-grid .tool-card:nth-child(4n+2) .tool-icon{
  background:linear-gradient(145deg,rgba(17,167,139,.22),rgba(37,119,255,.15))!important;
}
body.tdh-category-page .tool-grid .tool-card:nth-child(4n+3) .tool-icon{
  background:linear-gradient(145deg,rgba(125,68,255,.23),rgba(225,69,207,.14))!important;
}
body.tdh-category-page .tool-grid .tool-card:nth-child(4n+4) .tool-icon{
  background:linear-gradient(145deg,rgba(231,146,38,.18),rgba(108,74,255,.16))!important;
}

@media(max-width:1200px){
  body.tdh-category-page .tool-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}
@media(max-width:820px){
  body.tdh-category-page .tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:540px){
  body.tdh-category-page .tool-grid{grid-template-columns:1fr!important}
  body.tdh-category-page .tool-grid .tool-card{min-height:260px!important}
}


/* =========================================================
   FINAL COMPACT CONTENT ROW — approved Tool Digital Hub look
   ========================================================= */
.tdh-compact-row{
  display:grid;
  grid-template-columns:minmax(0,2fr) minmax(280px,.95fr);
  gap:14px;
  margin-top:16px;
}
.tdh-compact-card{
  border:1px solid rgba(70,157,255,.24);
  background:linear-gradient(180deg,rgba(10,31,54,.96),rgba(5,20,36,.98));
  border-radius:18px;
  padding:18px;
  box-shadow:0 16px 34px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.025);
}
.tdh-compact-card h2{
  margin:0 0 13px;
  font-size:17px;
  line-height:1.25;
  color:#fff !important;
  background:none !important;
  -webkit-text-fill-color:initial !important;
}
.tdh-compact-faq details{
  border:1px solid rgba(70,157,255,.18);
  background:rgba(3,18,33,.62);
  border-radius:10px;
  overflow:hidden;
}
.tdh-compact-faq details+details{margin-top:8px}
.tdh-compact-faq summary{
  cursor:pointer;
  list-style:none;
  padding:11px 13px;
  color:#f7fbff;
  font-size:13px;
  font-weight:800;
}
.tdh-compact-faq summary::-webkit-details-marker{display:none}
.tdh-compact-faq summary::before{content:"›";margin-right:8px;color:#66d9ff}
.tdh-compact-faq details[open] summary::before{content:"⌄"}
.tdh-compact-faq p{
  margin:0;
  padding:0 13px 12px 28px;
  color:#9fb4ca !important;
  font-size:12.5px;
  line-height:1.6;
}
.tdh-related-list{display:grid;gap:0}
.tdh-related-list a{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:11px 2px;
  border-bottom:1px solid rgba(70,157,255,.12);
  color:#dff6ff;
  text-decoration:none;
  font-size:13px;
  font-weight:700;
}
.tdh-related-list a:last-child{border-bottom:0}
.tdh-related-list a:hover{color:#59dcff}
.tdh-related-list b{color:#65dcff}
.tdh-legacy-long-content{display:none!important}
@media(max-width:760px){
  .tdh-compact-row{grid-template-columns:1fr}
}

/* TDH GLOBAL UI CONSISTENCY 2026-09-08 START */
/* Consistent controls, actions and mobile usability across all tool pages. */
.tdh-final-original label,
.tdh-final-original .field-label,
.tdh-final-original .label{
  color:#dceafb!important;
  font-weight:700;
  line-height:1.35;
}

.tdh-final-original input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
.tdh-final-original select,
.tdh-final-original textarea{
  width:100%;
  min-height:50px;
  padding:12px 14px!important;
  font:inherit;
  line-height:1.35;
  border-radius:12px!important;
  transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
.tdh-final-original textarea{min-height:140px;resize:vertical}
.tdh-final-original input::placeholder,
.tdh-final-original textarea::placeholder{color:#718aa2!important;opacity:1}

.tdh-final-original input:focus-visible,
.tdh-final-original select:focus-visible,
.tdh-final-original textarea:focus-visible,
.tdh-final-original button:focus-visible,
.tdh-final-original .btn:focus-visible,
.tdh-final-original [role="button"]:focus-visible{
  outline:2px solid #68e4ff!important;
  outline-offset:2px!important;
  box-shadow:0 0 0 4px rgba(54,220,255,.13)!important;
}

.tdh-final-original input[type="checkbox"],
.tdh-final-original input[type="radio"]{
  accent-color:#27c8ff;
  width:18px;
  height:18px;
}

.tdh-final-original input[type="file"]{
  padding:7px!important;
  min-height:52px;
  color:#b9cde0!important;
}
.tdh-final-original input[type="file"]::file-selector-button{
  min-height:36px;
  margin-right:10px;
  padding:8px 13px;
  border:1px solid rgba(83,203,255,.28);
  border-radius:9px;
  background:linear-gradient(135deg,#0d4770,#183d78);
  color:#fff;
  font:inherit;
  font-weight:800;
  cursor:pointer;
}

.tdh-final-original button,
.tdh-final-original .btn,
.tdh-final-original .calculate-btn,
.tdh-final-original .convert-btn,
.tdh-final-original .compress-btn,
.tdh-final-original .download-btn,
.tdh-final-original .action-btn{
  min-height:48px!important;
  padding:11px 16px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px;
  font:inherit;
  font-weight:800!important;
  line-height:1.2;
  text-align:center;
  white-space:normal;
  overflow-wrap:anywhere;
  cursor:pointer;
  transition:transform .18s ease,box-shadow .18s ease,filter .18s ease,opacity .18s ease;
}
.tdh-final-original button:hover:not(:disabled),
.tdh-final-original .btn:hover:not([aria-disabled="true"]){
  transform:translateY(-1px);
  filter:brightness(1.06);
}
.tdh-final-original button:active:not(:disabled),
.tdh-final-original .btn:active:not([aria-disabled="true"]){transform:translateY(0)}

/* Secondary actions should not visually compete with the primary action. */
.tdh-final-original .secondary-btn,
.tdh-final-original .clear-btn,
.tdh-final-original .reset-btn,
.tdh-final-original button.secondary,
.tdh-final-original button[data-variant="secondary"]{
  color:#d7e9f7!important;
  background:#082139!important;
  border:1px solid #245777!important;
  box-shadow:none!important;
}

.tdh-final-original button:disabled,
.tdh-final-original .btn[aria-disabled="true"],
.tdh-final-original [disabled]{
  opacity:.48!important;
  cursor:not-allowed!important;
  transform:none!important;
  filter:none!important;
}

/* Common upload/drop areas across legacy templates. */
.tdh-final-original .drop,
.tdh-final-original .drop-zone,
.tdh-final-original .dropzone,
.tdh-final-original .upload-zone,
.tdh-final-original .upload-area,
.tdh-final-original .upload-box,
.tdh-final-original .file-drop,
.tdh-final-original .file-drop-zone{
  min-width:0;
  max-width:100%;
  border:1.5px dashed #2b7ca6!important;
  border-radius:15px!important;
  background:linear-gradient(145deg,rgba(8,40,64,.72),rgba(5,23,41,.88))!important;
  transition:border-color .18s ease,background .18s ease,box-shadow .18s ease;
}
.tdh-final-original .drop:hover,
.tdh-final-original .drop-zone:hover,
.tdh-final-original .dropzone:hover,
.tdh-final-original .upload-zone:hover,
.tdh-final-original .upload-area:hover,
.tdh-final-original .upload-box:hover,
.tdh-final-original .file-drop:hover,
.tdh-final-original .file-drop-zone:hover{
  border-color:#46d8ff!important;
  box-shadow:0 0 0 3px rgba(54,220,255,.06)!important;
}

/* Result/status language: neutral, success and error remain visually distinct. */
.tdh-final-original .result,
.tdh-final-original .result-box,
.tdh-final-original .output,
.tdh-final-original .preview,
.tdh-final-original .file-info,
.tdh-final-original .status{
  max-width:100%;
  border-radius:13px!important;
}
.tdh-final-original .error,
.tdh-final-original [role="alert"]{
  color:#ff9bb1!important;
  overflow-wrap:anywhere;
}

.tdh-final-original table{width:100%;border-collapse:collapse}
.tdh-final-original th,
.tdh-final-original td{overflow-wrap:anywhere;word-break:normal}
.tdh-final-original pre,
.tdh-final-original code{max-width:100%}
.tdh-final-original img,
.tdh-final-original video,
.tdh-final-original canvas{height:auto}

/* Prevent action/tool rows from becoming unusably narrow or overflowing. */
.tdh-final-original .actions,
.tdh-final-original .action-row,
.tdh-final-original .btn-row,
.tdh-final-original .button-row,
.tdh-final-original .controls{
  min-width:0;
  max-width:100%;
}

/* Mobile keeps basic navigation visible instead of hiding every nav link. */
@media(max-width:800px){
  .tdh-final-nav{height:auto;min-height:66px;gap:12px;padding:8px 0}
  .tdh-final-brand{font-size:17px;min-width:0}
  .tdh-final-brand img{width:27px;height:27px}
  .tdh-final-links{display:flex!important;gap:12px;margin-left:auto}
  .tdh-final-links a{font-size:12px;white-space:nowrap}
  .tdh-final-links a:nth-child(n+3){display:none}
  .tdh-final-crumb{overflow-wrap:anywhere}
}

@media(max-width:560px){
  .tdh-final-page{width:min(100% - 18px,1240px)}
  .tdh-final-hero{display:grid;grid-template-columns:48px minmax(0,1fr);gap:14px;padding:17px!important}
  .tdh-final-icon{width:48px!important;height:48px!important;flex-basis:48px!important;border-radius:14px;font-size:25px!important}
  .tdh-final-hero h1{font-size:clamp(25px,8vw,34px);line-height:1.08}
  .tdh-final-hero p{font-size:13px}
  .tdh-final-pills{grid-column:1 / -1;margin-top:5px}
  .tdh-final-pill{font-size:10px;padding:5px 8px}
  .tdh-final-work{padding:13px!important;border-radius:16px}
  .tdh-final-work-title{font-size:15px;margin-bottom:14px}
  .tdh-final-original .actions,
  .tdh-final-original .action-row,
  .tdh-final-original .btn-row,
  .tdh-final-original .button-row{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:9px!important;
  }
  .tdh-final-original .actions > *,
  .tdh-final-original .action-row > *,
  .tdh-final-original .btn-row > *,
  .tdh-final-original .button-row > *{
    width:100%!important;
    min-width:0!important;
  }
  .tdh-final-original input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
  .tdh-final-original select,
  .tdh-final-original textarea{font-size:16px!important} /* avoids iOS zoom */
}
/* TDH GLOBAL UI CONSISTENCY 2026-09-08 END */

/* TDH GLOBAL TOOL USABILITY PASS 2026-09-08 START */
/* Small global refinements after the 1000-tool usability audit. */
.tdh-final-original .field,
.tdh-final-original .tdh-batch-field,
.tdh-final-original .form-group,
.tdh-final-original .input-group,
.tdh-final-original .control-group{
  min-width:0;
  max-width:100%;
}

.tdh-final-original .controls,
.tdh-final-original .actions,
.tdh-final-original .action-row,
.tdh-final-original .btn-row,
.tdh-final-original .button-row{
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
}

.tdh-final-original input[type="file"]{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.tdh-final-original .tdh-file-selected,
.tdh-final-original .tdh-file-selected.drop,
.tdh-final-original .tdh-file-selected.drop-zone,
.tdh-final-original .tdh-file-selected.upload-zone,
.tdh-final-original .tdh-file-selected.upload-area,
.tdh-final-original .tdh-file-selected.upload-box{
  border-color:#38d8ff!important;
  box-shadow:0 0 0 3px rgba(56,216,255,.08)!important;
}

.tdh-final-original .hint,
.tdh-final-original .help,
.tdh-final-original .note,
.tdh-final-original small{
  overflow-wrap:anywhere;
}

.tdh-final-original [aria-invalid="true"]{
  border-color:#ff6688!important;
  box-shadow:0 0 0 3px rgba(255,102,136,.12)!important;
}

.tdh-final-original .status:not(:empty),
.tdh-final-original .error:not(:empty),
.tdh-final-original .result:not(:empty),
.tdh-final-original .output:not(:empty){
  overflow-wrap:anywhere;
}

@media(max-width:560px){
  .tdh-final-original .controls{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:9px!important;
  }
  .tdh-final-original .controls > *{
    width:100%!important;
    min-width:0!important;
  }
  .tdh-final-original input[type="file"]::file-selector-button{
    max-width:48%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
}
/* TDH GLOBAL TOOL USABILITY PASS 2026-09-08 END */

/* TDH DEEP USABILITY PASS — FILE/DOWNLOAD STATES — 2026-09-08 */
.tdh-final-original .tdh-drag-active,
html.tdh-file-dragging .tdh-final-original .drop:hover,
html.tdh-file-dragging .tdh-final-original .drop-zone:hover,
html.tdh-file-dragging .tdh-final-original .dropzone:hover,
html.tdh-file-dragging .tdh-final-original .upload-zone:hover,
html.tdh-file-dragging .tdh-final-original .upload-area:hover,
html.tdh-file-dragging .tdh-final-original .upload-box:hover,
html.tdh-file-dragging .tdh-final-original .file-drop:hover,
html.tdh-file-dragging .tdh-final-original .file-drop-zone:hover{
  border-color:#5be4ff!important;
  background:linear-gradient(145deg,rgba(9,61,88,.84),rgba(8,30,52,.94))!important;
  box-shadow:0 0 0 4px rgba(54,220,255,.10)!important;
}
.tdh-final-original a[download].tdh-download-pending{
  opacity:.5!important;
  filter:saturate(.55)!important;
  cursor:not-allowed!important;
  box-shadow:none!important;
}
.tdh-final-original input[type="file"][aria-invalid="true"]{
  border-color:#ff6688!important;
  box-shadow:0 0 0 3px rgba(255,102,136,.10)!important;
}
/* TDH DEEP USABILITY PASS END */


/* ==========================================================
   TOOL DIGITAL HUB - PHASE 49 REAL PHONE TOOL-PAGE POLISH
   Mobile-only refinement for all 3530 tool pages.
   ========================================================== */
@media (max-width: 800px) {
  .tdh-final-page {
    width: min(100% - 18px, 1240px) !important;
  }

  .tdh-final-nav {
    height: auto !important;
    min-height: 68px !important;
    padding: 8px 0 7px !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 7px 10px !important;
    position: sticky !important;
    top: 0 !important;
    z-index: 90 !important;
    background: rgba(2, 10, 20, .94) !important;
    -webkit-backdrop-filter: blur(12px) saturate(130%) !important;
    backdrop-filter: blur(12px) saturate(130%) !important;
    border-bottom-color: rgba(68, 180, 242, .18) !important;
    box-shadow: 0 10px 28px rgba(0,0,0,.2) !important;
  }

  .tdh-final-brand {
    gap: 8px !important;
    font-size: 18px !important;
    white-space: nowrap !important;
  }

  .tdh-final-brand img {
    width: 36px !important;
    height: 36px !important;
    flex: 0 0 36px !important;
  }

  /* Keep the tool-page navigation reachable on phone instead of hiding it. */
  .tdh-final-links {
    display: flex !important;
    order: 3 !important;
    width: 100% !important;
    max-width: 100% !important;
    gap: 5px !important;
    padding: 4px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    border: 1px solid rgba(70, 178, 238, .14) !important;
    border-radius: 13px !important;
    background: rgba(6, 24, 42, .72) !important;
    scrollbar-width: none !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior-inline: contain;
    scroll-snap-type: x proximity;
  }

  .tdh-final-links::-webkit-scrollbar {
    display: none !important;
  }

  .tdh-final-links a {
    flex: 0 0 auto !important;
    min-height: 40px !important;
    padding: 8px 12px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1px solid transparent !important;
    border-radius: 9px !important;
    color: #c9d8e7 !important;
    white-space: nowrap !important;
    scroll-snap-align: start;
    touch-action: manipulation;
  }

  .tdh-final-links a:active {
    color: #fff !important;
    border-color: rgba(67, 206, 255, .22) !important;
    background: rgba(22, 113, 181, .18) !important;
  }

  .tdh-final-crumb {
    padding: 13px 2px 10px !important;
    font-size: 11.5px !important;
    line-height: 1.5 !important;
    overflow-wrap: anywhere !important;
  }

  .tdh-final-hero {
    gap: 13px !important;
    padding: 18px !important;
    border-radius: 18px !important;
    align-items: flex-start !important;
    background: radial-gradient(circle at 95% 0, rgba(111, 69, 255, .12), transparent 34%), linear-gradient(145deg, #061b30, #07182b 70%, #121433) !important;
    box-shadow: 0 15px 34px rgba(0,0,0,.18) !important;
  }

  .tdh-final-icon {
    width: 54px !important;
    height: 54px !important;
    flex: 0 0 54px !important;
    border-radius: 15px !important;
    font-size: 26px !important;
    box-shadow: 0 0 20px rgba(26,165,255,.08) !important;
  }

  .tdh-final-hero h1 {
    margin-bottom: 6px !important;
    font-size: clamp(26px, 7.8vw, 35px) !important;
    line-height: 1.05 !important;
    letter-spacing: -.035em !important;
    text-wrap: balance;
    overflow-wrap: anywhere;
  }

  .tdh-final-hero p {
    font-size: 13.5px !important;
    line-height: 1.55 !important;
  }

  .tdh-final-pills {
    gap: 6px !important;
    margin-top: 10px !important;
  }

  .tdh-final-pill {
    padding: 5px 8px !important;
    font-size: 10.5px !important;
  }

  .tdh-final-work {
    margin-top: 12px !important;
    padding: 14px !important;
    border-radius: 18px !important;
    box-shadow: 0 14px 32px rgba(0,0,0,.16) !important;
  }

  .tdh-final-work-title {
    gap: 8px !important;
    margin-bottom: 14px !important;
    font-size: 15px !important;
  }

  .tdh-final-work-title b {
    width: 28px !important;
    height: 28px !important;
  }

  .tdh-final-original input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
  .tdh-final-original select,
  .tdh-final-original textarea,
  .tdh-final-original button,
  .tdh-final-original .btn,
  .tdh-final-original .calculate-btn,
  .tdh-final-original .convert-btn,
  .tdh-final-original .compress-btn,
  .tdh-final-original .download-btn,
  .tdh-final-original .clear-btn,
  .tdh-final-original .action-btn {
    font-size: 16px !important;
  }

  .tdh-final-original input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
  .tdh-final-original select,
  .tdh-final-original button,
  .tdh-final-original .btn,
  .tdh-final-original .calculate-btn,
  .tdh-final-original .convert-btn,
  .tdh-final-original .compress-btn,
  .tdh-final-original .download-btn,
  .tdh-final-original .clear-btn,
  .tdh-final-original .action-btn {
    min-height: 48px !important;
  }

  .tdh-final-quick {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
    margin-top: 12px !important;
  }

  .tdh-final-quick div {
    min-width: 0 !important;
    padding: 10px !important;
    font-size: 11px !important;
    line-height: 1.4 !important;
  }

  .tdh-final-quick div:last-child:nth-child(odd) {
    grid-column: 1 / -1 !important;
  }

  .tdh-final-guides {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    margin: 10px 0 20px !important;
  }

  .tdh-final-guide,
  .tdh-compact-card {
    padding: 15px !important;
    border-radius: 16px !important;
    box-shadow: 0 12px 26px rgba(0,0,0,.13) !important;
    content-visibility: auto;
    contain-intrinsic-size: 220px;
  }

  .tdh-final-guide h2,
  .tdh-compact-card h2 {
    font-size: 15px !important;
  }

  .tdh-final-guide li,
  .tdh-compact-faq summary,
  .tdh-related-list a {
    font-size: 12.5px !important;
  }

  .tdh-compact-row {
    gap: 10px !important;
    margin-top: 12px !important;
  }

  .tdh-related-list a {
    min-height: 44px !important;
    padding: 10px 4px !important;
    touch-action: manipulation;
  }

  pre,
  code,
  table,
  .tdh-final-original .result,
  .tdh-final-original .output,
  .tdh-final-original .preview {
    max-width: 100% !important;
  }

  /* Lower-page cards are expensive across thousands of tools; defer rendering offscreen. */
  .tdh-final-guides,
  .tdh-compact-row {
    content-visibility: auto;
    contain-intrinsic-size: 560px;
  }

  body::before {
    position: absolute !important;
    background-size: 52px 52px !important;
  }
}

@media (max-width: 520px) {
  .tdh-final-page {
    width: min(100% - 14px, 1240px) !important;
  }

  .tdh-final-brand {
    font-size: 17px !important;
  }

  .tdh-final-brand img {
    width: 34px !important;
    height: 34px !important;
    flex-basis: 34px !important;
  }

  .tdh-final-hero {
    padding: 15px !important;
  }

  .tdh-final-icon {
    width: 48px !important;
    height: 48px !important;
    flex-basis: 48px !important;
    font-size: 23px !important;
  }

  .tdh-final-hero h1 {
    font-size: clamp(24px, 7.6vw, 32px) !important;
  }

  .tdh-final-work {
    padding: 12px !important;
  }
}

@media (max-width: 360px) {
  .tdh-final-quick {
    grid-template-columns: 1fr !important;
  }

  .tdh-final-quick div:last-child:nth-child(odd) {
    grid-column: auto !important;
  }

  .tdh-final-hero {
    gap: 10px !important;
  }

  .tdh-final-icon {
    width: 44px !important;
    height: 44px !important;
    flex-basis: 44px !important;
    font-size: 21px !important;
  }
}

@media (hover: none), (pointer: coarse) {
  .tdh-final-original button:hover,
  .tdh-final-original .btn:hover,
  .tdh-final-guide:hover,
  .tdh-compact-card:hover,
  .tdh-related-list a:hover {
    transform: none !important;
  }
}

/* Phase 49 mobile-only AI nav item injected by the lightweight finalizer. */
.tdh-mobile-ai-link{display:none!important}
@media (max-width:800px){
  .tdh-final-links .tdh-mobile-ai-link{display:inline-flex!important}
}