/* Shared shell for every individual tool page. Tool-specific layouts stay intact. */
.tool-ui{
  --primary:#a84f2d;
  --primary-dark:#873c21;
  --primary-light:#f8eee8;
  --primary-soft:#e8cbbb;
  --accent:#a84f2d;
  --accent-hover:#873c21;
  --text:#292722;
  --text-secondary:#68645d;
  --text-muted:#8b857b;
  --bg:#f7f5f1;
  --bg-white:#fff;
  --bg-subtle:#f2f0eb;
  --border:#e5e1d9;
  --border-light:#eeebe5;
  --radius:8px;
  color:var(--text);
  background:var(--bg);
}
.tool-ui .site-header.tool-site-header{
  position:sticky;
  top:0;
  z-index:100;
  border-bottom:1px solid #e8e4dc;
  background:rgba(255,255,255,.96);
  backdrop-filter:saturate(160%) blur(10px);
  -webkit-backdrop-filter:saturate(160%) blur(10px);
}
.tool-ui .tool-nav-container{
  display:flex;
  align-items:center;
  gap:30px;
  max-width:1240px;
  height:64px;
  margin:0 auto;
  padding:0 24px;
}
.tool-ui .tool-brand{
  display:flex;
  align-items:center;
  gap:9px;
  flex:none;
  color:#292722;
  text-decoration:none;
  font-size:16px;
  font-weight:760;
  letter-spacing:-.25px;
}
.tool-ui .tool-brand-mark{
  width:31px;
  height:31px;
  display:grid;
  place-items:center;
  border-radius:8px;
  color:#fff;
  background:#b5532e;
}
.tool-ui .tool-brand-mark svg{width:18px;height:18px}
.tool-ui .tool-brand small{margin-left:1px;color:#969087;font-size:10px;font-weight:500;letter-spacing:0}
.tool-ui .tool-global-nav{display:flex;align-items:center;gap:22px;margin-left:auto}
.tool-ui .tool-global-nav a{color:#69645d;text-decoration:none;font-size:12px;transition:color .2s}
.tool-ui .tool-global-nav a:hover{color:#a84f2d}
.tool-ui .tool-search-link{
  height:34px;
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:0 9px;
  border:1px solid #e7e3dc;
  border-radius:7px;
  color:#5e5a53;
  text-decoration:none;
  font-size:11px;
  transition:border-color .2s,background .2s;
}
.tool-ui .tool-search-link:hover{border-color:#d8beb0;background:#fcf8f5}
.tool-ui .tool-search-link svg{width:15px;height:15px;fill:none;stroke:#8b8379;stroke-width:1.8;stroke-linecap:round}
.tool-ui .tool-search-link kbd{margin-left:3px;color:#989187;font:500 9px var(--font-sans)}
.tool-ui .tool-page{min-height:calc(100vh - 150px);padding:0 0 60px}
.tool-ui .tool-page > .container{max-width:1160px;padding-top:18px;padding-right:24px;padding-left:24px}
.tool-ui .tool-breadcrumb{
  max-width:1160px;
  min-height:47px;
  display:flex;
  align-items:center;
  gap:9px;
  margin:0 auto;
  padding:0 24px;
  color:#969087;
  font-size:11px;
}
.tool-ui .tool-breadcrumb>a{color:#777169;text-decoration:none;transition:color .2s}
.tool-ui .tool-breadcrumb>a:hover{color:#a84f2d}
.tool-ui .tool-crumb-current{display:flex;align-items:center;gap:7px;color:#4b4740}
.tool-ui .tool-crumb-icon{width:23px;height:23px;display:block;flex:none}
.tool-ui .tool-crumb-icon .tool-icon-svg{display:block;width:100%;height:100%}
.tool-ui .tool-page .tool-pg-header{margin:0 0 12px}
.tool-ui .tool-page .tool-pg-header>a:first-child{display:none}
.tool-ui .tool-title-row{display:flex;align-items:center;gap:12px;margin:3px 0 12px}
.tool-ui .tool-title-icon{width:46px;height:46px;display:block;flex:none}
.tool-ui .tool-title-icon .tool-icon-svg{display:block;width:100%;height:100%}
.tool-ui .tool-page h1{margin:0;color:#292722;font-size:27px;font-weight:740;letter-spacing:-.6px;line-height:1.25}
.tool-ui .tool-page h2{color:#302d28;letter-spacing:-.2px}
.tool-ui .tool-page .lp-intro{max-width:880px;margin:0 0 22px;color:#6c675f;font-size:13px;line-height:1.85}
.tool-ui .tool-page .tool-pg-body,
.tool-ui .tool-page .tool-shell{
  border:1px solid #e7e3dc;
  border-radius:11px;
  background:#fff;
  box-shadow:0 2px 8px rgba(45,38,29,.035);
}
.tool-ui .tool-page .tool-pg-body{padding:22px}
.tool-ui .tool-page .tool-shell{padding:20px}
.tool-ui .tool-page .tool-header{margin:-20px -20px 20px;padding:17px 20px 15px;border-bottom:1px solid #eeeae4;border-radius:11px 11px 0 0;background:#fcfbf9}
.tool-ui .tool-page .tool-header h1{font-size:23px}
.tool-ui .tool-page .tool-header>p{margin:6px 0 0;color:#7d776e;font-size:12px}
.tool-ui .tool-page input[type="text"],
.tool-ui .tool-page input[type="search"],
.tool-ui .tool-page input[type="url"],
.tool-ui .tool-page input[type="number"],
.tool-ui .tool-page input[type="email"],
.tool-ui .tool-page input[type="password"],
.tool-ui .tool-page input[type="date"],
.tool-ui .tool-page input[type="datetime-local"],
.tool-ui .tool-page select,
.tool-ui .tool-page textarea{
  border:1px solid #dcd7cf;
  border-radius:7px;
  background:#fff;
  color:#292722;
  font:inherit;
  transition:border-color .18s,box-shadow .18s;
}
.tool-ui .tool-page input[type="text"],
.tool-ui .tool-page input[type="search"],
.tool-ui .tool-page input[type="url"],
.tool-ui .tool-page input[type="number"],
.tool-ui .tool-page input[type="email"],
.tool-ui .tool-page input[type="password"],
.tool-ui .tool-page input[type="date"],
.tool-ui .tool-page input[type="datetime-local"],
.tool-ui .tool-page select{min-height:36px;padding:7px 10px}
.tool-ui .tool-page textarea{padding:10px 12px}
.tool-ui .tool-page input:focus,
.tool-ui .tool-page select:focus,
.tool-ui .tool-page textarea:focus{outline:none;border-color:#bd8068;box-shadow:0 0 0 3px rgba(168,79,45,.1)}
.tool-ui .tool-page input[type="checkbox"],
.tool-ui .tool-page input[type="radio"],
.tool-ui .tool-page input[type="range"],
.tool-ui .tool-page input[type="color"],
.tool-ui .tool-page input[type="file"]{accent-color:#a84f2d}
.tool-ui .tool-page .btn{min-height:34px;border-radius:7px;font-size:12px;transition:background .18s,border-color .18s,color .18s,transform .18s}
.tool-ui .tool-page .btn-primary{border:1px solid #a84f2d;background:#a84f2d;color:#fff;box-shadow:none}
.tool-ui .tool-page .btn-primary:hover{border-color:#873c21;background:#873c21;box-shadow:none}
.tool-ui .tool-page .btn-secondary{border:1px solid #e2ddd5;background:#f7f5f1;color:#514c44}
.tool-ui .tool-page .btn-secondary:hover{border-color:#d9c5b8;background:#fbf5f0;color:#873c21}
.tool-ui .tool-page .btn-outline{border-color:#ddd8cf;color:#58534b;background:#fff}
.tool-ui .tool-page .btn-outline:hover{border-color:#d1b2a1;color:#873c21;background:#fbf7f3}
.tool-ui .tool-page .drop-zone,
.tool-ui .tool-page .hero-drop{border-color:#d9d4cc;border-radius:10px;background:#fcfbf9}
.tool-ui .tool-page .drop-zone:hover,
.tool-ui .tool-page .hero-drop:hover{border-color:#b87c62;background:#fbf5f0}
.tool-ui .tool-page .result-area,
.tool-ui .tool-page pre,
.tool-ui .tool-page .output-area{border-color:#e5e1d9;border-radius:8px;background:#f8f7f4}
.tool-ui .tool-page .lp-section{margin-top:27px}
.tool-ui .tool-page .lp-feature,
.tool-ui .tool-page .related-links,
.tool-ui .tool-page .model-props,
.tool-ui .tool-page .viewer-info{border-color:#e8e4dd;border-radius:9px;background:#fff}
.tool-ui .tool-page .lp-feature::before{background:#b5532e}
.tool-ui .tool-page .lp-feature:hover{border-color:#dcc8bb;box-shadow:0 5px 14px rgba(45,38,29,.05)}
.tool-ui .tool-page .lp-section h2::before,
.tool-ui .tool-page .rt-title::before,
.tool-ui .tool-page .cs-title::before{background:#b5532e}
.tool-ui #related-tools{border-color:#e5e1d9}
.tool-ui .rt-card{border-color:#e8e4dd;border-radius:8px;box-shadow:none}
.tool-ui .rt-card:hover{border-color:#d7c0b2;box-shadow:0 4px 10px rgba(45,38,29,.05);transform:translateY(-1px)}
.tool-ui .rt-card::before{background:#b5532e}
.tool-ui .site-footer{margin-top:0;padding:22px 0 18px;border-top:1px solid #e8e4dc;background:#fff;color:#777169;text-align:left;font-size:11px}
.tool-ui .site-footer .container{max-width:1160px}
.tool-ui .tool-footer-row{min-height:54px;display:flex;align-items:center;gap:15px;border-bottom:1px solid #eeeae4}
.tool-ui .tool-footer-brand{display:flex;align-items:center;gap:8px;color:#302d28;text-decoration:none;font-size:12px}
.tool-ui .tool-footer-brand .tool-brand-mark{width:25px;height:25px;border-radius:7px;font-size:12px}
.tool-ui .tool-footer-brand strong{font-weight:740}
.tool-ui .tool-footer-row>p{color:#827c73;font-size:10px}
.tool-ui .site-footer .footer-links{display:flex;flex-wrap:wrap;gap:16px;margin:0 0 0 auto}
.tool-ui .site-footer .footer-links .sep{display:none}
.tool-ui .site-footer .footer-links a,
.tool-ui .site-footer .footer-beian a{color:#777169;text-decoration:none}
.tool-ui .site-footer .footer-links a:hover,
.tool-ui .site-footer .footer-beian a:hover{color:#a84f2d}
.tool-ui .site-footer .footer-beian{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-top:10px;font-size:10px}
.tool-ui .site-footer .footer-beian img{width:14px;height:14px;vertical-align:middle}
@media(max-width:760px){
  .tool-ui .tool-nav-container{height:58px;gap:10px;padding:0 16px}
  .tool-ui .tool-brand{gap:7px;font-size:14px}.tool-ui .tool-brand small{display:none}
  .tool-ui .tool-global-nav{gap:12px}
  .tool-ui .tool-global-nav a{font-size:10px;white-space:nowrap}
  .tool-ui .tool-search-link{width:33px;justify-content:center;padding:0}.tool-ui .tool-search-link span,.tool-ui .tool-search-link kbd{display:none}
  .tool-ui .tool-breadcrumb{min-height:42px;gap:7px;padding:0 16px;font-size:10px}
  .tool-ui .tool-page{padding-bottom:42px}
  .tool-ui .tool-page > .container{padding:12px 16px 0}
  .tool-ui .tool-title-icon{width:40px;height:40px}
  .tool-ui .tool-page h1{font-size:23px}
  .tool-ui .tool-page .tool-pg-body{padding:15px}
  .tool-ui .tool-page .tool-shell{padding:14px}
  .tool-ui .tool-page .tool-header{margin:-14px -14px 15px;padding:14px}
  .tool-ui .tool-footer-row{min-height:0;flex-wrap:wrap;gap:9px;padding-bottom:12px}.tool-ui .tool-footer-row>p{width:calc(100% - 130px)}
  .tool-ui .site-footer .footer-links{width:100%;margin-left:0;gap:13px}
  .tool-ui .site-footer .footer-beian{align-items:flex-start;flex-direction:column;gap:5px}
  .tool-ui .site-footer .footer-beian a{display:inline-flex;margin:0!important}
}
@media(max-width:420px){
  .tool-ui .tool-global-nav a:nth-child(3){display:none}
  .tool-ui .tool-title-icon{width:36px;height:36px}
  .tool-ui .tool-page h1{font-size:21px}
}

/* Plain utility UI: square controls, direct borders and no decorative icon tiles. */
.tool-ui{
  --bg:#f7f8fa;
  --bg-subtle:#f1f3f5;
  --border:#dfe3e7;
  --border-light:#e8ebee;
  --radius:4px;
  background:#f7f8fa;
}
.tool-ui .site-header.tool-site-header{border-color:#dfe3e7;background:#fff;backdrop-filter:none;-webkit-backdrop-filter:none}
.tool-ui .tool-nav-container{height:58px}
.tool-ui .tool-brand-mark{border-radius:3px}
.tool-ui .tool-global-nav a:hover,.tool-ui .tool-search-link:hover{border-radius:2px}
.tool-ui .tool-search-link{border-radius:3px;box-shadow:none}
.tool-ui .tool-page > .container{max-width:1000px;padding-top:12px}
.tool-ui .tool-breadcrumb{min-height:40px}
.tool-ui .tool-crumb-icon{width:23px;height:23px;overflow:hidden}
.tool-ui .tool-crumb-icon .tool-icon-svg{width:100%;height:100%;max-width:100%;margin:0;overflow:hidden}
.tool-ui .tool-title-row{gap:8px;margin-top:0}
.tool-ui .tool-title-icon{width:42px;height:42px;overflow:visible}
.tool-ui .tool-title-icon .tool-icon-svg{width:54px;height:54px;max-width:none;margin:-6px;overflow:visible}
.tool-ui .tool-page h1{font-size:25px;font-weight:660;letter-spacing:-.25px}
.tool-ui .tool-page .lp-intro{max-width:850px;margin-bottom:16px;color:#606a73;font-size:13px;line-height:1.65}
.tool-ui .tool-page .tool-pg-body,.tool-ui .tool-page .tool-shell{border:1px solid #dfe3e7;border-radius:3px;background:#fff;box-shadow:none}
.tool-ui .tool-page .tool-pg-body{padding:18px}
.tool-ui .tool-page .tool-shell{padding:16px}
.tool-ui .tool-page .tool-header{margin:-16px -16px 16px;padding:14px 16px;border-radius:3px 3px 0 0;background:#f7f8fa}
.tool-ui .tool-page input[type="text"],.tool-ui .tool-page input[type="search"],.tool-ui .tool-page input[type="url"],.tool-ui .tool-page input[type="number"],.tool-ui .tool-page input[type="email"],.tool-ui .tool-page input[type="password"],.tool-ui .tool-page input[type="date"],.tool-ui .tool-page input[type="datetime-local"],.tool-ui .tool-page select,.tool-ui .tool-page textarea{border-radius:3px;box-shadow:none}
.tool-ui .tool-page input:focus,.tool-ui .tool-page select:focus,.tool-ui .tool-page textarea:focus{box-shadow:0 0 0 2px rgba(168,79,45,.12)}
.tool-ui .tool-page .btn,.tool-ui .tool-page .btn-primary,.tool-ui .tool-page .btn-secondary,.tool-ui .tool-page .btn-outline{border-radius:3px;box-shadow:none}
.tool-ui .tool-page .drop-zone,.tool-ui .tool-page .hero-drop{border-radius:3px;box-shadow:none}
.tool-ui .tool-page .result-area,.tool-ui .tool-page pre,.tool-ui .tool-page .output-area{border-radius:3px;box-shadow:none}
.tool-ui .tool-page .lp-section{margin-top:24px}
.tool-ui .tool-page .lp-section h2::before,.tool-ui .tool-page .rt-title::before,.tool-ui .tool-page .cs-title::before{display:none}
.tool-ui .tool-page .lp-features{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px;margin-top:8px}
.tool-ui .tool-page .lp-feature{position:static;overflow:visible;padding:11px 0;border:0;border-bottom:1px solid #e1e5e8;border-radius:0;background:transparent;box-shadow:none;transition:none}
.tool-ui .tool-page .lp-feature::before{display:none}
.tool-ui .tool-page .lp-feature:hover{border-color:#e1e5e8;background:transparent;box-shadow:none;transform:none}
.tool-ui .tool-page .lp-feature h3{font-size:13px;font-weight:650}
.tool-ui .tool-page .lp-feature p{font-size:12px;color:#606b75;line-height:1.65}
.tool-ui .tool-page .lp-steps{font-size:13px}
.tool-ui .tool-page .lp-faq dt{font-size:14px}
.tool-ui .tool-page .lp-faq dd{font-size:13px}
.tool-ui .tool-page .related-links,.tool-ui .tool-page .model-props,.tool-ui .tool-page .viewer-info{border-radius:3px;box-shadow:none}
.tool-ui .rt-card{border-radius:3px;box-shadow:none}
.tool-ui .rt-card:hover{box-shadow:none;transform:none}
.tool-ui .site-footer{border-color:#dfe3e7}
@media(max-width:760px){
  .tool-ui .tool-page .lp-features{grid-template-columns:1fr;gap:0}
  .tool-ui .tool-page .tool-pg-body{padding:13px}
  .tool-ui .tool-page .tool-shell{padding:12px}
  .tool-ui .tool-title-icon{width:38px;height:38px}
  .tool-ui .tool-title-icon .tool-icon-svg{width:48px;height:48px;margin:-5px}
}

/* Give the working area a clear edge so it reads as the page's main action. */
.tool-ui .tool-page .tool-pg-body{
  border:1px solid #cfd6dc;
  border-top:3px solid #a84f2d;
  background:#fff;
  box-shadow:0 2px 9px rgba(38,45,51,.06);
}
.tool-ui .tool-page .tool-shell{
  border-color:#cfd6dc;
  box-shadow:0 2px 9px rgba(38,45,51,.06);
}