/* =========================================================
   Textify — design tokens
   Theme: the editor's desk — paper, ink, red pen, highlighter
   ========================================================= */
:root{
  --paper:      #FAF9F6;
  --paper-dim:  #F1EEE7;
  --ink:        #1B1B1F;
  --ink-soft:   #4A4A50;
  --muted:      #85837C;
  --red:        #C6402F;
  --red-dim:    #E7C9C4;
  --highlight:  #F5C518;
  --rule:       #DEDAD0;
  --white:      #FFFFFF;
  --mono: 'JetBrains Mono', 'SFMono-Regular', Menlo, Consolas, monospace;
  --sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --radius: 3px;
  --maxw: 1080px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:inherit;}
::selection{background:var(--highlight);color:var(--ink);}

h1,h2,h3,h4{
  font-family:var(--mono);
  font-weight:700;
  line-height:1.15;
  margin:0 0 .5em;
  letter-spacing:-0.01em;
}
h1{font-size:clamp(2rem,4.2vw,3.4rem);}
h2{font-size:clamp(1.4rem,2.6vw,2rem);}
h3{font-size:1.15rem;}
p{margin:0 0 1em;color:var(--ink-soft);}

.container{max-width:var(--maxw);margin:0 auto;padding:0 24px;}

/* focus visibility */
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{
  outline:2px solid var(--red);outline-offset:2px;
}
@media (prefers-reduced-motion:reduce){*{animation:none !important;transition:none !important;}}

/* ---------- header ---------- */
.site-header{
  border-bottom:1px solid var(--rule);
  background:var(--paper);
  position:sticky;top:0;z-index:50;
}
.site-header .container{
  display:flex;align-items:center;justify-content:space-between;
  height:68px;
}
.logo{
  font-family:var(--mono);font-weight:700;font-size:1.25rem;
  text-decoration:none;color:var(--ink);display:flex;align-items:center;gap:2px;
}
.logo .cursor{
  display:inline-block;width:9px;height:1.1em;background:var(--red);
  animation:blink 1.1s steps(1) infinite;margin-left:2px;
}
@keyframes blink{50%{opacity:0;}}

nav.main-nav{display:flex;align-items:center;gap:28px;}
nav.main-nav a{
  text-decoration:none;font-size:.95rem;color:var(--ink-soft);font-weight:500;
  position:relative;padding:4px 0;
}
nav.main-nav a:hover,nav.main-nav a.active{color:var(--ink);}
nav.main-nav a.active::after{
  content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--red);
}
.lang-switch{display:flex;gap:2px;font-family:var(--mono);font-size:.8rem;}
.lang-switch a{
  padding:4px 8px;text-decoration:none;color:var(--muted);border:1px solid var(--rule);
}
.lang-switch a:first-child{border-radius:var(--radius) 0 0 var(--radius);}
.lang-switch a:last-child{border-radius:0 var(--radius) var(--radius) 0;}
.lang-switch a.active{background:var(--ink);color:var(--paper);border-color:var(--ink);}
.nav-toggle{display:none;background:none;border:none;font-family:var(--mono);font-size:1.4rem;color:var(--ink);cursor:pointer;}

@media (max-width:820px){
  nav.main-nav{
    position:absolute;top:68px;left:0;right:0;background:var(--paper);
    flex-direction:column;align-items:flex-start;gap:0;border-bottom:1px solid var(--rule);
    max-height:0;overflow:hidden;transition:max-height .25s ease;
  }
  nav.main-nav.open{max-height:400px;}
  nav.main-nav a{padding:14px 24px;width:100%;border-bottom:1px solid var(--rule);}
  .lang-switch{padding:14px 24px;}
  .nav-toggle{display:block;}
}

/* ---------- hero ---------- */
.hero{padding:64px 0 40px;border-bottom:1px solid var(--rule);}
.hero .eyebrow{
  font-family:var(--mono);color:var(--red);font-size:.82rem;
  text-transform:uppercase;letter-spacing:.12em;margin-bottom:14px;display:block;
}
.hero h1{max-width:16ch;}
.hero .mark{position:relative;white-space:nowrap;}
.hero .mark svg{position:absolute;left:0;bottom:-.15em;width:100%;height:.3em;}
.hero-lede{max-width:52ch;font-size:1.08rem;}

/* live demo box (signature element) */
.live-demo{
  margin-top:36px;background:var(--white);border:1px solid var(--rule);
  border-radius:var(--radius);overflow:hidden;
  box-shadow:0 1px 0 var(--rule);
}
.live-demo textarea{
  width:100%;min-height:140px;border:none;resize:vertical;padding:20px;
  font-family:var(--sans);font-size:1rem;color:var(--ink);background:transparent;
}
.live-demo textarea:focus{outline:none;}
.live-stats{
  display:flex;flex-wrap:wrap;gap:0;border-top:1px solid var(--rule);background:var(--paper-dim);
}
.live-stats .stat{
  flex:1 1 120px;padding:14px 20px;border-right:1px solid var(--rule);
}
.live-stats .stat:last-child{border-right:none;}
.live-stats .stat b{
  display:block;font-family:var(--mono);font-size:1.5rem;color:var(--ink);
}
.live-stats .stat span{font-size:.78rem;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;}

/* ---------- ad slots ---------- */
.ad-slot{
  margin:32px auto;max-width:var(--maxw);padding:0 24px;
}
.ad-slot .ad-box{
  border:1px dashed var(--rule);background:var(--paper-dim);
  min-height:90px;display:flex;align-items:center;justify-content:center;
  font-family:var(--mono);font-size:.75rem;color:var(--muted);letter-spacing:.06em;
  text-transform:uppercase;border-radius:var(--radius);
}

/* ---------- section / grids ---------- */
section{padding:56px 0;}
section.tight{padding:32px 0;}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:28px;flex-wrap:wrap;}
.section-head p{margin:0;max-width:46ch;}
.see-all{font-family:var(--mono);font-size:.85rem;text-decoration:none;color:var(--red);white-space:nowrap;}

.grid{display:grid;gap:18px;}
.grid.cols-3{grid-template-columns:repeat(3,1fr);}
.grid.cols-2{grid-template-columns:repeat(2,1fr);}
@media (max-width:820px){.grid.cols-3,.grid.cols-2{grid-template-columns:1fr;}}

.card{
  background:var(--white);border:1px solid var(--rule);border-radius:var(--radius);
  padding:24px;text-decoration:none;color:inherit;display:block;
  transition:border-color .15s ease, transform .15s ease;
}
.card:hover{border-color:var(--ink);transform:translateY(-2px);}
.card .tag{
  font-family:var(--mono);font-size:.72rem;color:var(--red);text-transform:uppercase;
  letter-spacing:.08em;display:block;margin-bottom:10px;
}
.card h3{margin-bottom:8px;font-family:var(--sans);font-weight:700;}
.card p{margin:0;font-size:.92rem;}

.blog-card .date{font-family:var(--mono);font-size:.78rem;color:var(--muted);margin-bottom:6px;display:block;}

/* ---------- tool page ---------- */
.tool-hero{padding:44px 0 8px;}
.breadcrumb{font-family:var(--mono);font-size:.8rem;color:var(--muted);margin-bottom:18px;}
.breadcrumb a{text-decoration:none;color:var(--muted);}
.breadcrumb a:hover{color:var(--ink);}

.tool-panel{
  background:var(--white);border:1px solid var(--rule);border-radius:var(--radius);
  padding:24px;margin:24px 0;
}
.tool-panel textarea{
  width:100%;min-height:220px;border:1px solid var(--rule);border-radius:var(--radius);
  padding:16px;font-family:var(--mono);font-size:.95rem;color:var(--ink);
  background:var(--paper-dim);resize:vertical;
}
.tool-panel textarea:focus{outline:none;border-color:var(--ink);}
.tool-controls{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px;}
.btn{
  font-family:var(--mono);font-size:.85rem;padding:11px 18px;border-radius:var(--radius);
  border:1px solid var(--ink);background:var(--ink);color:var(--paper);cursor:pointer;
  text-decoration:none;display:inline-flex;align-items:center;gap:8px;
}
.btn:hover{background:var(--red);border-color:var(--red);}
.btn.ghost{background:transparent;color:var(--ink);}
.btn.ghost:hover{background:var(--ink);color:var(--paper);}
.btn.small{padding:7px 12px;font-size:.78rem;}

.tool-stats{display:flex;flex-wrap:wrap;gap:0;margin-top:18px;border:1px solid var(--rule);border-radius:var(--radius);overflow:hidden;}
.tool-stats .stat{flex:1 1 100px;padding:12px 16px;border-right:1px solid var(--rule);background:var(--paper-dim);}
.tool-stats .stat:last-child{border-right:none;}
.tool-stats .stat b{display:block;font-family:var(--mono);font-size:1.3rem;}
.tool-stats .stat span{font-size:.72rem;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;}

.tool-article{max-width:70ch;margin-top:8px;}
.tool-article h2{margin-top:1.4em;}
.tool-article ul{color:var(--ink-soft);padding-left:1.2em;}
.tool-article li{margin-bottom:.4em;}

.faq details{border-bottom:1px solid var(--rule);padding:14px 0;}
.faq summary{font-family:var(--sans);font-weight:600;cursor:pointer;list-style:none;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::before{content:"+ ";color:var(--red);font-family:var(--mono);}
.faq details[open] summary::before{content:"– ";}
.faq p{margin-top:10px;}

/* ---------- blog post ---------- */
.post-head{padding:44px 0 24px;border-bottom:1px solid var(--rule);}
.post-meta{font-family:var(--mono);font-size:.82rem;color:var(--muted);}
.post-body{max-width:68ch;padding:36px 0;}
.post-body h2{margin-top:1.6em;}
.post-body p{font-size:1.02rem;}
.post-body blockquote{
  border-left:3px solid var(--red);margin:1.6em 0;padding:.2em 0 .2em 1.2em;
  font-style:italic;color:var(--ink-soft);
}

/* ---------- footer ---------- */
footer{border-top:1px solid var(--rule);padding:40px 0 30px;margin-top:20px;}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:24px;}
@media (max-width:820px){.footer-grid{grid-template-columns:1fr 1fr;}}
footer h4{font-family:var(--mono);font-size:.82rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-bottom:12px;}
footer ul{list-style:none;padding:0;margin:0;}
footer li{margin-bottom:8px;}
footer a{text-decoration:none;color:var(--ink-soft);font-size:.92rem;}
footer a:hover{color:var(--red);}
.footer-bottom{
  margin-top:32px;padding-top:20px;border-top:1px solid var(--rule);
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;
  font-family:var(--mono);font-size:.78rem;color:var(--muted);
}

.toast{
  position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);
  background:var(--ink);color:var(--paper);padding:12px 20px;border-radius:var(--radius);
  font-family:var(--mono);font-size:.85rem;opacity:0;pointer-events:none;
  transition:opacity .2s ease, transform .2s ease;z-index:100;
}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0);}

/* ---------- privacy / consent ---------- */
.consent-banner{
  position:fixed;left:16px;right:16px;bottom:16px;z-index:120;
  background:var(--ink);color:var(--paper);border:1px solid var(--ink-soft);
  box-shadow:0 12px 30px rgba(0,0,0,.22);border-radius:var(--radius);
}
.consent-banner[hidden]{display:none;}
.consent-banner__content{max-width:var(--maxw);margin:0 auto;padding:18px 22px;}
.consent-banner strong{font-family:var(--mono);font-size:.95rem;}
.consent-banner p{color:#eee;margin:6px 0 12px;max-width:78ch;font-size:.9rem;}
.consent-banner a{color:var(--paper);font-size:.82rem;}
.consent-banner__actions{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:8px;}
.consent-banner .btn{background:var(--paper);color:var(--ink);border-color:var(--paper);}
.consent-banner .btn.ghost{background:transparent;color:var(--paper);border-color:var(--paper);}
.ad-box[data-textify-ad]:empty::before{content:'Espaço publicitário disponível após configuração';}
.privacy-note{max-width:70ch;margin:30px auto;padding:18px 22px;background:var(--paper-dim);border-left:3px solid var(--red);}
.privacy-note h2{font-size:1.25rem;}
.privacy-note p{font-size:.94rem;}
@media (max-width:600px){
  .consent-banner{left:8px;right:8px;bottom:8px;}
  .consent-banner__content{padding:16px;}
  .consent-banner__actions .btn{width:100%;justify-content:center;}
}

/* ---------- expanded tools ---------- */
.calc-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:18px;}
.calc-grid label{display:flex;flex-direction:column;gap:6px;font-family:var(--mono);font-size:.78rem;color:var(--muted);}
.calc-grid input,.calc-grid select{font:inherit;font-family:var(--sans);font-size:1rem;padding:11px;border:1px solid var(--rule);border-radius:var(--radius);background:var(--paper);color:var(--ink);}
.result-box{margin-top:22px;padding:20px;border:1px solid var(--rule);background:var(--paper-dim);border-radius:var(--radius);}
.result-box strong{font-family:var(--mono);font-size:1.5rem;}
.result-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:14px;}
.result-list div{display:flex;justify-content:space-between;gap:12px;border-bottom:1px solid var(--rule);padding:8px 0;color:var(--ink-soft);}
.result-list b{font-family:var(--mono);color:var(--ink);}
@media (max-width:650px){.calc-grid,.result-list{grid-template-columns:1fr;}}

.media-preview{max-width:100%;max-height:260px;margin-top:16px;border:1px solid var(--rule);background:var(--paper-dim);}
input[type=file]{font:inherit;max-width:100%;padding:10px 0;}

/* ---------- Textify modern visual refresh ---------- */
:root{
  --paper:#f7f8fc;
  --paper-dim:#eef1f7;
  --ink:#172033;
  --ink-soft:#586579;
  --muted:#7d899b;
  --red:#635bff;
  --red-dim:#dcd9ff;
  --highlight:#9de7d7;
  --rule:#e2e7f0;
  --white:#ffffff;
  --radius:14px;
  --maxw:1160px;
}
body{background:radial-gradient(circle at 8% -10%,#e8e7ff 0,transparent 32rem),radial-gradient(circle at 100% 0,#dff8f2 0,transparent 28rem),var(--paper);color:var(--ink);font-size:16px;}
h1,h2,h3,h4{letter-spacing:-.035em;}
.container{padding-left:28px;padding-right:28px;}
.site-header{background:rgba(247,248,252,.78);border-bottom:1px solid rgba(226,231,240,.8);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);}
.site-header .container{height:76px;}
.logo{font-family:var(--sans);font-weight:800;font-size:1.2rem;letter-spacing:-.04em;}
.logo .cursor{width:7px;height:7px;border-radius:99px;background:var(--red);animation:none;}
nav.main-nav{gap:8px;background:rgba(255,255,255,.65);padding:6px;border:1px solid var(--rule);border-radius:999px;box-shadow:0 8px 24px rgba(35,45,80,.06);}
nav.main-nav a{font-size:.9rem;border-radius:999px;padding:8px 14px;color:var(--ink-soft);}
nav.main-nav a:hover,nav.main-nav a.active{background:var(--ink);color:#fff;}
nav.main-nav a.active::after{display:none;}
.lang-switch{margin-left:4px;border-left:1px solid var(--rule);padding-left:6px;}
.lang-switch a{border:0!important;background:transparent!important;color:var(--muted)!important;padding:7px 8px!important;}
.lang-switch a.active{background:var(--red)!important;color:#fff!important;}
.hero{padding:92px 0 70px;border-bottom:0;}
.hero .eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--red);background:var(--red-dim);border:1px solid #cbc7ff;border-radius:999px;padding:7px 12px;font-size:.72rem;letter-spacing:.08em;}
.hero h1{max-width:14ch;font-size:clamp(2.8rem,7vw,5.6rem);line-height:.98;margin-top:18px;}
.hero-lede{max-width:58ch;font-size:1.12rem;color:var(--ink-soft);}
.live-demo{margin-top:38px;border:1px solid rgba(226,231,240,.9);border-radius:20px;background:rgba(255,255,255,.86);box-shadow:0 24px 60px rgba(39,50,92,.12);}
.live-demo textarea{min-height:180px;padding:24px;font-size:1.03rem;}
.live-stats{background:linear-gradient(90deg,#f4f6fb,#fff);}
.live-stats .stat{padding:18px 22px;border-right-color:var(--rule);}
.live-stats .stat b{font-size:1.7rem;color:var(--red);}
section{padding:72px 0;}
section.tight{padding:42px 0;}
.section-head{margin-bottom:30px;}
.section-head h2{font-size:clamp(1.7rem,3vw,2.5rem);}
.card{border:1px solid rgba(226,231,240,.9);border-radius:18px;padding:26px;background:rgba(255,255,255,.82);box-shadow:0 8px 22px rgba(39,50,92,.045);transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;}
.card:hover{border-color:#bcb8ff;box-shadow:0 18px 35px rgba(66,60,170,.12);transform:translateY(-5px);}
.card .tag{color:var(--red);background:#eeedff;border-radius:999px;display:inline-flex;padding:5px 9px;font-size:.68rem;letter-spacing:.04em;}
.card h3{font-family:var(--sans);font-size:1.13rem;letter-spacing:-.025em;margin-top:16px;}
.card p{color:var(--ink-soft);}
.tool-hero,.post-head{padding:64px 0 28px;border-bottom:0;}
.tool-hero h1,.post-head h1{font-size:clamp(2.2rem,5vw,4rem);max-width:18ch;}
.breadcrumb{color:var(--muted);}
.tool-panel{border:1px solid rgba(226,231,240,.9);border-radius:20px;padding:28px;background:rgba(255,255,255,.88);box-shadow:0 18px 45px rgba(39,50,92,.08);}
.tool-panel textarea,.tool-panel input,.tool-panel select{border-color:var(--rule);border-radius:11px;background:#fbfcff;}
.tool-panel textarea:focus,.tool-panel input:focus,.tool-panel select:focus{border-color:var(--red);box-shadow:0 0 0 4px rgba(99,91,255,.12);}
.calc-grid input,.calc-grid select{border-radius:11px;}
.btn{border-radius:10px;border-color:var(--red);background:var(--red);font-family:var(--sans);font-weight:700;box-shadow:0 8px 18px rgba(99,91,255,.2);}
.btn:hover{background:#5048e8;border-color:#5048e8;transform:translateY(-1px);}
.btn.ghost{background:#fff;color:var(--ink);border-color:var(--rule);box-shadow:none;}
.result-box{border:1px solid #d9d7ff;background:linear-gradient(135deg,#f3f2ff,#effaf7);border-radius:16px;}
.result-box strong{color:var(--red);}
.post-body{font-size:1.06rem;line-height:1.8;}
.post-body h2{font-size:1.7rem;margin-top:2em;}
blockquote{background:#f1f0ff;border-radius:0 14px 14px 0;}
footer{background:#111827;border-top:0;color:#d7deeb;margin-top:40px;padding:56px 0 32px;}
footer p,footer a{color:#aeb9ca;}
footer a:hover{color:#fff;}
footer h4{color:#8794aa;}
.footer-bottom{border-top-color:#2d3748;}
.consent-banner{border:1px solid #3c4860;border-radius:18px;background:rgba(17,24,39,.94);backdrop-filter:blur(16px);}
.privacy-note{border-left:0;border-radius:16px;background:linear-gradient(135deg,#f1f0ff,#ecfaf6);}
@media (max-width:820px){
  .site-header .container{height:68px;}
  nav.main-nav{border-radius:0;padding:0;background:rgba(247,248,252,.98);border:0;border-bottom:1px solid var(--rule);box-shadow:0 14px 28px rgba(39,50,92,.08);}
  nav.main-nav a{border-radius:0!important;background:transparent!important;color:var(--ink-soft)!important;padding:14px 24px!important;}
  nav.main-nav a.active{color:var(--red)!important;}
  .lang-switch{border-left:0;padding-left:0;margin:0 24px 12px;}
  .hero{padding-top:64px;}
}
@media (max-width:600px){.container{padding-left:18px;padding-right:18px;}.hero h1{font-size:clamp(2.5rem,14vw,4rem);}.live-demo{border-radius:16px;}.tool-panel{padding:20px;}.consent-banner{border-radius:14px;}}

/* ---------- Textify futuristic interface ---------- */
:root{
  --paper:#070b16;
  --paper-dim:#0d1424;
  --ink:#eef5ff;
  --ink-soft:#a9bad1;
  --muted:#71829b;
  --red:#7c5cff;
  --red-dim:rgba(124,92,255,.16);
  --highlight:#47f2d0;
  --rule:rgba(139,166,206,.17);
  --white:#ffffff;
  --radius:16px;
  --maxw:1160px;
}
html{background:var(--paper);}
body{background-color:#070b16;background-image:linear-gradient(rgba(71,242,208,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(71,242,208,.045) 1px,transparent 1px),radial-gradient(circle at 15% 0,rgba(124,92,255,.24),transparent 30rem),radial-gradient(circle at 90% 12%,rgba(71,242,208,.12),transparent 24rem);background-size:40px 40px,40px 40px,auto,auto;color:var(--ink);}
body:before{content:"";position:fixed;inset:0;pointer-events:none;background:linear-gradient(transparent 50%,rgba(71,242,208,.018) 50%);background-size:100% 4px;mix-blend-mode:screen;z-index:0;}
body>*{position:relative;z-index:1;}
a{color:var(--highlight);}
.site-header{background:rgba(7,11,22,.7);border-bottom:1px solid rgba(71,242,208,.18);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);}
.logo{color:var(--ink);font-family:var(--mono);text-transform:uppercase;letter-spacing:.08em;font-size:1rem;}
.logo .cursor{background:var(--highlight);box-shadow:0 0 12px var(--highlight);}
nav.main-nav{background:rgba(13,20,36,.76);border:1px solid rgba(71,242,208,.18);box-shadow:0 0 28px rgba(50,222,198,.08);}
nav.main-nav a{color:var(--ink-soft);font-family:var(--mono);font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;}
nav.main-nav a:hover,nav.main-nav a.active{background:linear-gradient(135deg,var(--red),#3e8cff);color:#fff;box-shadow:0 0 18px rgba(124,92,255,.4);}
.lang-switch a.active{background:var(--highlight)!important;color:#071018!important;box-shadow:0 0 14px rgba(71,242,208,.38);}
.hero{padding-top:100px;}
.hero .eyebrow{color:var(--highlight);background:rgba(71,242,208,.08);border:1px solid rgba(71,242,208,.3);font-family:var(--mono);text-transform:uppercase;box-shadow:0 0 22px rgba(71,242,208,.08);}
.hero h1{color:#f5f8ff;text-shadow:0 0 38px rgba(124,92,255,.25);}
.hero h1:after{content:"_";color:var(--highlight);text-shadow:0 0 16px var(--highlight);}
.hero-lede{color:var(--ink-soft);}
.live-demo,.tool-panel{background:linear-gradient(145deg,rgba(18,28,48,.9),rgba(9,15,29,.82));border:1px solid rgba(117,151,202,.25);box-shadow:0 24px 70px rgba(0,0,0,.3),inset 0 1px rgba(255,255,255,.04);}
.live-demo textarea,.tool-panel textarea,.tool-panel input,.tool-panel select,.calc-grid input,.calc-grid select{background:rgba(3,8,18,.72);border-color:rgba(117,151,202,.28);color:var(--ink);}
.live-demo textarea::placeholder,.tool-panel textarea::placeholder,.tool-panel input::placeholder{color:#637692;}
.live-demo textarea:focus,.tool-panel textarea:focus,.tool-panel input:focus,.tool-panel select:focus{border-color:var(--highlight);box-shadow:0 0 0 3px rgba(71,242,208,.12),0 0 22px rgba(71,242,208,.08);}
.live-stats{background:rgba(6,12,25,.8);}
.live-stats .stat{border-right-color:rgba(117,151,202,.2);}
.live-stats .stat b,.result-box strong{color:var(--highlight);text-shadow:0 0 14px rgba(71,242,208,.35);}
.section-head h2,.tool-hero h1,.post-head h1{color:#f2f7ff;text-shadow:0 0 22px rgba(124,92,255,.16);}
.card{background:linear-gradient(145deg,rgba(16,26,45,.88),rgba(8,14,27,.86));border:1px solid rgba(117,151,202,.2);box-shadow:0 12px 30px rgba(0,0,0,.2),inset 0 1px rgba(255,255,255,.035);}
.card:hover{border-color:rgba(71,242,208,.65);box-shadow:0 0 0 1px rgba(71,242,208,.18),0 18px 45px rgba(0,0,0,.34),0 0 28px rgba(71,242,208,.1);transform:translateY(-6px);}
.card .tag{color:var(--highlight);background:rgba(71,242,208,.09);border:1px solid rgba(71,242,208,.2);font-family:var(--mono);text-transform:uppercase;}
.card h3{color:var(--ink);}
.card p,.post-meta{color:var(--ink-soft);}
.tool-hero,.post-head{padding-top:74px;}
.breadcrumb{color:var(--muted);}
.breadcrumb a{color:var(--highlight);}
.btn{background:linear-gradient(135deg,var(--red),#3e8cff);border-color:transparent;color:#fff;box-shadow:0 0 20px rgba(124,92,255,.25);}
.btn:hover{background:linear-gradient(135deg,#937cff,var(--highlight));color:#061018;box-shadow:0 0 26px rgba(71,242,208,.3);}
.btn.ghost{background:rgba(255,255,255,.03);border-color:rgba(117,151,202,.3);color:var(--ink-soft);box-shadow:none;}
.btn.ghost:hover{border-color:var(--highlight);color:var(--highlight);background:rgba(71,242,208,.05);}
.result-box{background:linear-gradient(145deg,rgba(26,33,64,.72),rgba(9,37,45,.7));border-color:rgba(71,242,208,.25);}
.result-list div{border-bottom-color:rgba(117,151,202,.2);color:var(--ink-soft);}
.result-list b{color:var(--ink);}
.post-body{color:#c7d3e4;}
.post-body h2,.post-body h3{color:var(--ink);}
blockquote{background:rgba(124,92,255,.1);border-left-color:var(--highlight);color:var(--ink);}
code{background:rgba(71,242,208,.08);color:var(--highlight);border:1px solid rgba(71,242,208,.15);}
footer{background:#040711;border-top:1px solid rgba(71,242,208,.16);}
footer h4{color:var(--highlight);font-family:var(--mono);text-transform:uppercase;letter-spacing:.08em;}
footer a{color:#879ab4;}
footer a:hover{color:var(--highlight);}
.footer-bottom{border-top-color:rgba(117,151,202,.18);}
.consent-banner{background:rgba(4,7,17,.95);border-color:rgba(71,242,208,.25);box-shadow:0 0 35px rgba(0,0,0,.45);}
.privacy-note{background:rgba(71,242,208,.06);border:1px solid rgba(71,242,208,.2);color:var(--ink-soft);}
@media (max-width:820px){nav.main-nav{background:rgba(7,11,22,.98);border-color:rgba(71,242,208,.2);}.hero{padding-top:70px;}}