/* CFGConverter V7 premium design - native HTML, no JS dependency */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Plus+Jakarta+Sans:wght@500;600;700;800&display=swap');
:root{--accent:#059669;--ink:#10223b;--border:#dde7ec;--soft:#f4f8fb;--shadow:0 20px 70px rgba(12,31,56,.075)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:'DM Sans',system-ui,sans-serif!important;color:var(--ink)!important;background:radial-gradient(ellipse 900px 520px at 8% 4%,#dcfce7 0%,transparent 70%),radial-gradient(ellipse 700px 360px at 91% 14%,#dbeafe 0%,transparent 70%),#f8fafc!important;min-height:100vh}h1,h2,h3,strong{font-family:'Plus Jakarta Sans','DM Sans',sans-serif}h1{letter-spacing:-.055em;line-height:1.14!important}h2{letter-spacing:-.037em;line-height:1.2}a{transition:color .2s ease,transform .25s ease,background .25s ease,border-color .25s ease,box-shadow .25s ease}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #10b981!important;outline-offset:3px}nav,.nav{position:relative;z-index:3;background:rgba(255,255,255,.9)!important;box-shadow:0 1px 0 #e5ebf1;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);min-height:78px}nav>a:first-child,.nav>a:first-child{font-weight:800!important;letter-spacing:-.045em;color:#10223b!important;font-size:23px!important}nav>a:first-child:before,.nav>a:first-child:before{content:'◈';display:inline-grid;place-items:center;width:34px;height:34px;border-radius:11px;background:linear-gradient(145deg,#10b981,#047857);color:white;margin-inline-end:10px;font-size:20px;box-shadow:0 6px 18px #05966942}nav a,.nav a{color:#334155;text-decoration:none}nav a:hover,.nav a:hover{color:#059669}nav div,.nav .langs{align-items:center;flex-wrap:wrap}.prose{max-width:1100px!important}.prose article,main article{border:1px solid var(--border)!important;background:#fff;border-radius:20px!important;box-shadow:0 10px 35px #0f172a08}.toolcard{position:relative;overflow:hidden;border:1px solid var(--border)!important;border-radius:20px!important;background:rgba(255,255,255,.96)!important;box-shadow:0 8px 28px rgba(23,44,72,.045);color:#0f172a!important;padding:26px!important;min-height:170px;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease!important}.toolcard:before{content:'↗';position:absolute;top:19px;right:20px;width:32px;height:32px;display:grid;place-items:center;background:#ecfdf5;border-radius:9px;color:#047857;font-size:19px}.toolcard:hover{transform:translateY(-6px);box-shadow:0 22px 46px #0f172a16;border-color:#86efac!important}.toolcard strong{font-size:18px;padding-right:35px;line-height:1.4}.toolcard span{color:#64748b!important;line-height:1.7}main{animation:soft-enter .65s both}main>h1{font-size:clamp(34px,5.8vw,58px)!important}main>p{font-size:17px}main section{margin:55px 0!important}main section h2,.prose h2{font-size:clamp(24px,3vw,34px)}.cards{gap:20px!important}.cfg-app{background:#fff!important;border:1px solid #dce6ed!important;border-radius:22px!important;box-shadow:var(--shadow)!important;padding:clamp(20px,3vw,34px)!important;max-width:100%!important}.cfg-app textarea,.cfg-app input:not([type=file]),.cfg-app select{border-radius:12px!important;background:#f8fafc!important;border:1px solid #dce5ee!important;padding:14px!important}.cfg-app textarea:focus,.cfg-app input:focus,.cfg-app select:focus{background:#fff!important;border-color:#10b981!important}.cfg-button{border-radius:11px!important;padding:13px 20px!important;transition:transform .2s,box-shadow .2s,background .2s!important}.cfg-button.primary{background:linear-gradient(135deg,#059669,#047857)!important;box-shadow:0 7px 18px #05966930}.cfg-button:hover{transform:translateY(-2px);filter:none!important;box-shadow:0 9px 20px #10223b22}.cfg-status{border-radius:12px!important}.footer,footer{background:#0e2133!important;color:#cbd5e1!important;border:0!important;padding-top:36px!important;padding-bottom:36px!important;gap:20px!important}.footer a,footer a{color:#d6f9e6!important}.footer p,footer span{color:#94a3b8!important}.premium-hero{position:relative;text-align:center;max-width:1040px;margin:64px auto 20px;padding:20px 22px 60px}.premium-pill{display:inline-flex;gap:8px;align-items:center;border:1px solid #a7f3d0;background:#ecfdf5;border-radius:100px;padding:9px 18px;font-size:12px;letter-spacing:.08em;font-weight:800;color:#047857;text-transform:uppercase}.premium-pill:before{content:'';width:8px;height:8px;border-radius:50%;background:#10b981;box-shadow:0 0 0 5px #10b98120}.premium-hero h1{font-size:clamp(40px,6.6vw,76px)!important;margin:22px 0;letter-spacing:-.07em;line-height:1.1!important;background:linear-gradient(110deg,#10233c 27%,#0d9b77);background-clip:text;-webkit-background-clip:text;color:transparent}.premium-hero>p{max-width:710px;color:#52657c;font-size:clamp(16px,2vw,20px);line-height:1.8;margin:0 auto 25px}.premium-actions{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;margin:26px 0}.premium-button{display:inline-flex;align-items:center;gap:10px;padding:15px 23px;border-radius:12px;font-weight:750;text-decoration:none;background:linear-gradient(130deg,#059669,#047857);color:white!important;box-shadow:0 10px 24px #0596693c}.premium-button:hover{transform:translateY(-3px);box-shadow:0 18px 30px #05966944}.premium-button.alt{background:white;border:1px solid #cbd5e1;color:#1e293b!important;box-shadow:0 8px 22px #0f172a0b}.premium-points{display:flex;gap:26px;align-items:center;justify-content:center;flex-wrap:wrap;margin-top:35px;color:#64748b;font-size:13px}.premium-points span:before{content:'✓';color:#059669;font-weight:900;margin-inline-end:7px}.premium-section{max-width:1130px;margin:0 auto 72px;padding:0 22px}.premium-section .eyebrow{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.15em;color:#059669}.premium-section h2{font-size:clamp(26px,4vw,40px);margin:12px 0}.premium-section>p{color:#64748b;margin:0 0 26px;max-width:650px}.premium-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:19px}.premium-grid .toolcard{min-height:225px!important;gap:15px!important}.premium-icon{display:inline-grid;place-items:center;width:52px;height:52px;border-radius:15px;background:linear-gradient(130deg,#d1fae5,#eff6ff);font-size:23px;color:#047857;font-style:normal}.premium-grid .toolcard span:last-child{font-size:13px;font-weight:800;color:#047857!important;margin-top:auto}.premium-feature{background:linear-gradient(125deg,#0f2e3f,#0c6b59);color:#fff;border-radius:27px;padding:clamp(25px,5vw,55px);display:flex;justify-content:space-between;gap:20px;align-items:center;box-shadow:0 22px 46px #0e3b3b25}.premium-feature h2{color:white;margin:6px 0}.premium-feature p{color:#d3eee7;max-width:620px}.premium-feature a{background:white;color:#065f46!important;flex-shrink:0}.premium-guides{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.premium-guides a{background:white;border:1px solid #dce6ed;border-radius:17px;padding:23px;color:#1e293b;text-decoration:none;font-weight:750;box-shadow:0 8px 28px #0f172a08}.premium-guides a:hover{transform:translateY(-4px);border-color:#6ee7b7}.premium-faq article{margin:13px 0;padding:21px 25px}.premium-faq article h3{margin:0 0 8px;font-size:17px}.premium-faq article p{margin:0;color:#64748b}.premium-faq{padding-bottom:30px}@keyframes soft-enter{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}@media(max-width:850px){.premium-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.premium-guides{grid-template-columns:1fr}.premium-feature{flex-direction:column;align-items:flex-start}nav,.nav{padding:14px 20px!important}}@media(max-width:580px){.premium-grid{grid-template-columns:1fr}.premium-hero{margin:30px auto 0;padding-bottom:30px}.premium-actions{flex-direction:column}.premium-actions a{width:100%;justify-content:center}.premium-points{gap:12px}nav,.nav{gap:12px!important}.nav .langs,nav div{gap:12px!important}.toolcard{min-height:155px}.premium-section{margin-bottom:44px}.cfg-app{padding:17px!important}}[dir=rtl] .toolcard:before{right:auto;left:20px}[dir=rtl] .toolcard strong{padding-right:0;padding-left:35px}

/* V7.1 - centered homepage layout and consistent responsive gutters */
html { width:100%; overflow-x:clip; }
body { width:100%; min-width:320px; }
body > main:has(.premium-hero) {
  width:min(100% - 40px, 1180px);
  max-width:1180px;
  margin-inline:auto;
  padding:0 0 56px;
  text-align:center;
}
body > main:has(.premium-hero) > .premium-hero {
  width:100%; max-width:920px;
  margin:clamp(44px,7vw,96px) auto 48px;
  padding:0 12px 18px;
  text-align:center;
}
body > main:has(.premium-hero) .premium-hero h1 {
  max-width:850px;
  margin:24px auto;
  text-wrap:balance;
}
body > main:has(.premium-hero) .premium-hero > p {
  margin-inline:auto;
  text-wrap:pretty;
}
body > main:has(.premium-hero) .premium-section {
  width:100%;
  max-width:1130px;
  margin:0 auto 78px !important;
  padding-inline:0;
  text-align:center;
}
body > main:has(.premium-hero) .premium-section > p {
  margin:0 auto 28px;
  max-width:710px;
}
body > main:has(.premium-hero) .premium-grid,
body > main:has(.premium-hero) .premium-guides {
  width:100%;
  margin-inline:auto;
  text-align:start;
}
body > main:has(.premium-hero) .premium-grid .toolcard {
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  text-decoration:none;
  text-align:start;
}
body > main:has(.premium-hero) .premium-feature {
  text-align:start;
}
body > main:has(.premium-hero) .premium-faq {
  max-width:920px;
}
body > main:has(.premium-hero) .premium-faq article {
  text-align:start;
}
body > .nav {
  width:100%;
  padding-left:max(20px, calc((100vw - 1180px)/2)) !important;
  padding-right:max(20px, calc((100vw - 1180px)/2)) !important;
}
body > .nav .langs {justify-content:flex-end;}
@media (max-width:700px) {
  body > main:has(.premium-hero) {width:calc(100% - 32px);padding-bottom:25px;}
  body > main:has(.premium-hero) > .premium-hero {margin:42px auto 34px;padding:0 4px 12px;}
  body > main:has(.premium-hero) .premium-hero h1 {font-size:clamp(34px,9vw,54px)!important;}
  body > main:has(.premium-hero) .premium-section {margin-bottom:48px !important;}
  body > main:has(.premium-hero) .premium-feature {align-items:stretch;}
  body > main:has(.premium-hero) .premium-feature .premium-button {justify-content:center;text-align:center;}
  body > .nav {justify-content:center;padding-inline:16px!important;text-align:center;}
  body > .nav .langs {justify-content:center;}
}
@media (max-width:380px) {
  body > main:has(.premium-hero) {width:calc(100% - 24px);}
  .premium-pill {font-size:10px;letter-spacing:.03em;}
}

/* V7.2: centered, bounded homepage. Reset old full-viewport and flex alignment overrides. */
html body > main:has(> .premium-hero) {
  display:block !important;
  box-sizing:border-box;
  width:min(100% - 40px, 1160px) !important;
  max-width:1160px !important;
  margin-inline:auto !important;
  padding:0 0 80px !important;
  float:none !important;
  position:relative;
}
html body > main:has(> .premium-hero) > section {
  box-sizing:border-box;
  width:100% !important;
  max-width:100% !important;
  margin-inline:auto !important;
  float:none !important;
}
html body > main:has(> .premium-hero) > .premium-hero {
  text-align:center !important;
  display:flex !important;
  flex-direction:column;
  align-items:center !important;
  padding:74px 18px 56px !important;
}
html body > main:has(> .premium-hero) > .premium-hero h1 {max-width:850px;margin-inline:auto !important;}
html body > main:has(> .premium-hero) > .premium-hero > p {max-width:720px;margin-inline:auto !important;}
html body > main:has(> .premium-hero) .premium-actions,
html body > main:has(> .premium-hero) .premium-points {justify-content:center !important;align-items:center !important;margin-inline:auto !important;}
html body > main:has(> .premium-hero) .premium-section > h2,
html body > main:has(> .premium-hero) .premium-section > p,
html body > main:has(> .premium-hero) .premium-section > .eyebrow {text-align:center !important;display:block;}
html body > main:has(> .premium-hero) .premium-grid {display:grid !important;grid-template-columns:repeat(3,minmax(0,1fr)) !important;gap:20px;width:100% !important;}
html body > main:has(> .premium-hero) .premium-grid > * {min-width:0;}
.home-decoder-shell{margin:0 auto 90px!important;max-width:1050px!important;}
.home-decoder-intro{text-align:center;max-width:740px;margin:0 auto 28px;}
.home-decoder-intro h2{font-size:clamp(25px,3.1vw,38px);margin:9px 0 12px;}
.home-decoder-intro p{color:#64748b;line-height:1.7;}
.home-decoder-card{background:rgba(255,255,255,.98);border:1px solid #dbe7ee;border-radius:24px;padding:26px;box-shadow:0 22px 75px rgba(15,23,42,.09),0 3px 15px rgba(15,23,42,.035);}
.home-decoder-columns{display:grid;grid-template-columns:1fr 1fr;gap:24px;}
.home-decoder-column{display:flex;flex-direction:column;min-width:0;gap:9px;}
.home-decoder-label{font-size:13px;font-weight:750;color:#334155;margin-top:7px;}
.home-decoder-column input[type=file],.home-decoder-column select,.home-decoder-column textarea{display:block;width:100%;border:1px solid #d7e1e9;background:#f8fafc;border-radius:12px;color:#0f172a;padding:12px 14px;font:14px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace;}
.home-decoder-column textarea{min-height:205px;resize:vertical;}
.home-decoder-column textarea:focus,.home-decoder-column select:focus{border-color:#059669;outline:3px solid #d1fae5;}
.home-decoder-status{min-height:25px;margin:0;color:#059669;font-size:12px;}
.home-decoder-status[data-error=true]{color:#be123c;}
.home-decoder-copy,.home-decoder-clear{border:1px solid #cbd5e1;background:white;color:#334155;border-radius:11px;padding:11px 17px;cursor:pointer;font-weight:700;}
.home-decoder-copy{align-self:flex-start;}
.home-decoder-copy:disabled{opacity:.45;cursor:not-allowed;}
.home-decoder-bottom{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;border-top:1px solid #e2e8f0;padding-top:23px;margin-top:23px;}
.home-decoder-bottom small{color:#64748b;max-width:270px;}
.home-decoder-actions{display:flex;flex-wrap:wrap;gap:11px;}
.home-decoder-primary{border:1px solid #047857;color:#fff;background:linear-gradient(135deg,#059669,#047857);border-radius:12px;padding:12px 19px;font-weight:750;cursor:pointer;box-shadow:0 8px 22px #05966929;transition:transform .2s ease,box-shadow .2s ease;}
.home-decoder-primary:hover{transform:translateY(-2px);box-shadow:0 13px 28px #05966935;}
.home-decoder-primary.outline{background:#ecfdf5;color:#047857;box-shadow:none;}
@media(max-width:850px){html body > main:has(> .premium-hero) .premium-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}.home-decoder-columns{grid-template-columns:1fr;}}
@media(max-width:600px){html body > main:has(> .premium-hero){width:calc(100% - 28px)!important;}html body > main:has(> .premium-hero) > .premium-hero{padding:48px 4px 35px!important;}html body > main:has(> .premium-hero) .premium-grid{grid-template-columns:1fr!important;}.home-decoder-card{padding:16px;border-radius:18px;}.home-decoder-actions,.home-decoder-actions button{width:100%;}.home-decoder-bottom small{text-align:center;max-width:none;width:100%;}}
@media(prefers-reduced-motion:reduce){.home-decoder-primary{transition:none!important;}.home-decoder-primary:hover{transform:none!important;}}

/* V7.3 size and optional, non-modal thank-you */
.home-size-note{display:block;margin:5px 0 15px;color:#64748b;font-size:.8rem}
.coffee-toast[hidden]{display:none!important}
.coffee-toast{position:relative;display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-top:18px;padding:14px 44px 14px 18px;border:1px solid #a7f3d0;border-radius:12px;background:#ecfdf5;box-shadow:0 6px 20px rgba(15,23,42,.06);animation:coffeeIn .25s ease-out}
.coffee-toast p{margin:0;flex:1 1 240px;font-size:.9rem;color:#065f46}
.coffee-toast a{background:#047857;color:white!important;border-radius:8px;padding:9px 13px;font-weight:700;text-decoration:none;white-space:nowrap}
.coffee-toast a:hover{background:#065f46}
.coffee-toast button{position:absolute;inset-inline-end:10px;top:7px;background:transparent;border:0;cursor:pointer;font-size:22px;color:#475569}
@keyframes coffeeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@media (prefers-reduced-motion:reduce){.coffee-toast{animation:none}}