:root{--p:#1457d9;--ps:#eaf1ff;--bg:#f6f8fc;--s:#fff;--t:#172033;--m:#5e697d;--b:#dfe5ef;--shadow:0 12px 35px #1f325117}
html[data-theme=dark]{--p:#77a7ff;--ps:#1f3357;--bg:#0e1420;--s:#171f2d;--t:#eef3ff;--m:#aeb9ce;--b:#2c3749}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--t);font-family:Inter,system-ui,sans-serif;line-height:1.6}a{text-decoration:none;color:inherit}.container{width:min(1160px,calc(100% - 32px));margin:auto}
header{position:sticky;top:0;z-index:5;background:var(--s);border-bottom:1px solid var(--b)}.nav{min-height:74px;display:flex;justify-content:space-between;align-items:center}.brand{display:flex;gap:10px;align-items:center;font-size:24px}.brand span{display:flex;flex-direction:column;font-size:16px}.brand small{font-size:12px;color:var(--m)}nav{display:flex;align-items:center;gap:18px}nav button,.actions button,.fav{border:1px solid var(--b);background:var(--s);color:var(--t);border-radius:12px;padding:10px 14px}
.hero{text-align:center;padding:72px 0 54px;background:radial-gradient(circle at 10% 20%,#2a71ff30,transparent 35%),var(--s)}.badge{display:inline-block;background:var(--ps);color:var(--p);padding:7px 13px;border-radius:999px;font-size:12px;font-weight:900}.hero h1{font-size:clamp(38px,6vw,66px);line-height:1.05;margin:18px auto 12px;max-width:780px}.hero p{color:var(--m);font-size:18px}.search{max-width:780px;margin:30px auto 0;background:var(--s);border:1px solid var(--b);border-radius:20px;padding:12px 18px;display:flex;gap:12px;box-shadow:var(--shadow)}.search input{border:0;outline:0;background:transparent;color:var(--t);width:100%;font-size:17px}
.content{padding:52px 0}.group{margin-bottom:42px}.group h2{font-size:25px}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.card{background:var(--s);border:1px solid var(--b);border-radius:18px;padding:20px;display:flex;gap:14px;min-height:140px}.card:hover{border-color:var(--p);transform:translateY(-2px)}.card>span{font-size:24px}.card h3{margin:0 0 6px}.card p{margin:0;color:var(--m);font-size:14px}.hidden{display:none!important}.seo{background:var(--s);border-top:1px solid var(--b);padding:55px 0}.prose{max-width:850px}.prose p,article p,.toolhead p{color:var(--m)}
.page{padding:30px 0 70px}.toolhead{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin:28px 0}.toolhead h1{font-size:clamp(34px,5vw,52px);line-height:1.1;margin:14px 0 8px}.layout{display:grid;grid-template-columns:1fr 300px;gap:24px}.box,aside{background:var(--s);border:1px solid var(--b);border-radius:20px;box-shadow:var(--shadow);padding:28px}.form{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.form label{display:flex;flex-direction:column;gap:6px;color:var(--m);font-weight:700;font-size:14px}.form input,.form select{height:52px;border:1px solid var(--b);border-radius:12px;background:var(--bg);color:var(--t);padding:0 14px}.primary{width:100%;margin-top:20px;min-height:54px;border:0;border-radius:14px;background:var(--p);color:#fff;font-weight:900}.result{margin-top:20px;min-height:110px;display:grid;place-items:center;text-align:center;background:var(--bg);border:1px dashed var(--b);border-radius:16px;padding:18px}.result strong{font-size:30px;color:var(--p)}.actions{display:flex;justify-content:center;gap:8px;margin-top:12px}aside a{display:block;padding:12px 0;border-bottom:1px solid var(--b)}article{max-width:850px;margin-top:42px}article h2{margin-top:34px}.notice{background:var(--ps);border-left:4px solid var(--p);padding:16px;margin-top:30px;border-radius:0 12px 12px 0}
footer{background:var(--s);border-top:1px solid var(--b);padding:35px 0;color:var(--m)}
@media(max-width:900px){.grid{grid-template-columns:repeat(2,1fr)}.layout{grid-template-columns:1fr}aside{display:none}}
@media(max-width:650px){nav a{display:none}.grid,.form{grid-template-columns:1fr}.toolhead{flex-direction:column}.hero{padding:50px 0}.hero h1{font-size:41px}}

.grouphead{display:flex;justify-content:space-between;align-items:end}.grouphead span{color:var(--m);font-size:13px}.wide{grid-column:1/-1}.breadcrumb{color:var(--m);font-size:13px;margin-bottom:20px}.result div div{margin-top:8px;color:var(--m)}.box select{height:52px;border:1px solid var(--b);border-radius:12px;background:var(--bg);color:var(--t);padding:0 14px}.actions{flex-wrap:wrap}


.rule3-intro{padding:4px 0 2px}.rule3-intro p{margin:3px 0 0;color:var(--m);font-size:14px}.rule3-visual{position:relative;min-height:210px;margin-top:8px;display:flex;justify-content:center;align-items:center;gap:34px;border:1px solid var(--b);border-radius:18px;background:linear-gradient(145deg,var(--ps),var(--s));overflow:hidden}.rule3-fraction{position:relative;z-index:2;display:grid;grid-template-rows:1fr 1fr;min-width:98px;text-align:center;font-size:31px;font-weight:900;color:var(--t)}.rule3-fraction span:first-child{padding:4px 18px 10px;border-bottom:3px solid var(--p)}.rule3-fraction span:last-child{padding:10px 18px 4px}.rule3-equals{position:relative;z-index:2;font-size:34px;font-weight:900;color:var(--p)}.rule3-cross{position:absolute;left:50%;top:50%;width:300px;max-width:86%;height:145px;transform:translate(-50%,-50%);pointer-events:none}.rule3-cross line{stroke:var(--p);stroke-width:2;stroke-dasharray:8 7;opacity:.32}.rule3-caption{text-align:center;padding:12px 15px;border-radius:13px;background:var(--bg);color:var(--m)}.rule3-caption strong{color:var(--t)}.rule3-steps{display:grid;gap:7px;text-align:left}.rule3-steps b{color:var(--p)}#xPreviewInput:disabled{font-weight:900;color:var(--p);opacity:1}
@media(max-width:650px){.rule3-visual{min-height:185px;gap:20px}.rule3-fraction{min-width:78px;font-size:25px}.rule3-cross{width:250px}.rule3-caption{font-size:14px}}

.formula-box,.timer-display{background:var(--bg);border:1px solid var(--b);border-radius:16px;padding:22px;text-align:center;font-size:26px;font-weight:800}.scientific-buttons,.timer-controls{display:flex;flex-wrap:wrap;gap:8px}.scientific-buttons button,.timer-controls button{border:1px solid var(--b);background:var(--s);color:var(--t);padding:12px 16px;border-radius:10px;font-weight:700}.timer-display{font-variant-numeric:tabular-nums;font-size:clamp(32px,7vw,58px)}.password-result{font-family:ui-monospace,monospace;overflow-wrap:anywhere;font-size:22px}
.quadratic-steps{display:grid;gap:9px;text-align:left;max-width:760px}.quadratic-steps>div{padding:9px 11px;border-radius:10px;background:var(--s);border:1px solid var(--b)}.quadratic-steps b{color:var(--p)}
.quadratic-chart{margin-top:8px;border:1px solid var(--b);border-radius:18px;background:var(--s);padding:14px;overflow:hidden}.quadratic-chart canvas{display:block;width:100%;height:auto;max-height:460px;background:var(--bg);border-radius:12px}.chart-legend{margin-top:10px;text-align:center;color:var(--m);font-size:14px}


/* Ourivesaria */
.alloy-intro,.gold-quote-hero{padding:4px 0}.alloy-intro p,.gold-quote-hero p{margin:4px 0 0;color:var(--m)}
.alloy-summary{display:flex;justify-content:space-between;gap:12px;align-items:center;background:linear-gradient(135deg,var(--ps),var(--s));border:1px solid var(--b);border-radius:15px;padding:15px 18px}.alloy-summary strong{color:var(--p);font-size:20px}.alloy-summary span{color:var(--m);font-size:13px}
.metal-builder{border:1px solid var(--b);border-radius:18px;padding:18px;background:var(--bg)}.metal-builder-head{display:flex;justify-content:space-between;gap:12px;margin-bottom:14px}.metal-builder-head span{color:var(--m);font-size:13px}.metal-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.metal-line{display:grid!important;grid-template-columns:1fr 110px;align-items:center;gap:10px;background:var(--s);border:1px solid var(--b);padding:9px 10px;border-radius:12px}.metal-line span{display:flex;align-items:center;gap:8px;color:var(--t)}.metal-line input[type=checkbox]{width:18px;height:18px}.metal-line>input{height:42px!important}.composition-total{text-align:right;margin-top:12px;color:var(--m)}.composition-total strong{color:var(--p)}.composition-total strong.invalid{color:#c62828}
.cost-details{border:1px solid var(--b);border-radius:14px;padding:12px 14px;background:var(--bg)}.cost-details summary{cursor:pointer;font-weight:800;color:var(--t)}.optional-price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}
.gold-quote-panel{border:1px solid #d9b85d;border-radius:18px;padding:18px;background:linear-gradient(135deg,#fff8da,var(--s))}html[data-theme=dark] .gold-quote-panel{background:linear-gradient(135deg,#3a321a,var(--s));border-color:#796526}.quote-head{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:14px}.quote-head>div{display:flex;flex-direction:column}.quote-head strong{font-size:19px}.quote-head small{color:var(--m)}.quote-head button{border:1px solid var(--b);background:var(--s);color:var(--t);border-radius:10px;padding:9px 13px;font-weight:800}.gold-quote-compact{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.gold-quote-compact>div{background:var(--s);border:1px solid var(--b);border-radius:12px;padding:12px;display:flex;flex-direction:column}.gold-quote-compact span{color:var(--m);font-size:12px}.gold-quote-compact strong{color:#9a6a00;font-size:17px}html[data-theme=dark] .gold-quote-compact strong{color:#ffd772}
.quote-table-wrap,.result-table-wrap{overflow-x:auto}.quote-table,.alloy-table{width:100%;border-collapse:collapse;background:var(--s);font-size:14px}.quote-table th,.quote-table td,.alloy-table th,.alloy-table td{padding:11px 10px;border-bottom:1px solid var(--b);text-align:right;white-space:nowrap}.quote-table th:first-child,.alloy-table th:first-child{text-align:left}.quote-table thead th,.alloy-table thead th{color:var(--m);font-size:12px;text-transform:uppercase}.quote-source,.quote-loading,.quote-error{color:var(--m);font-size:12px}.alloy-result{text-align:left;width:100%}.alloy-result-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:14px}.alloy-result-summary span{background:var(--s);border:1px solid var(--b);border-radius:10px;padding:10px}.alloy-table td small{display:block;color:var(--m);font-size:10px}.alloy-table tfoot th{font-weight:900}.alloy-cost{margin-top:14px;padding:13px;background:var(--ps);border-radius:11px}.alloy-cost small{display:block;color:var(--m)}.alloy-note{color:var(--m);font-size:13px;margin-bottom:0}
@media(max-width:700px){.metal-grid,.optional-price-grid{grid-template-columns:1fr}.metal-builder-head,.alloy-summary,.quote-head{align-items:flex-start;flex-direction:column}.gold-quote-compact{grid-template-columns:1fr}.alloy-result-summary{grid-template-columns:repeat(2,1fr)}.metal-line{grid-template-columns:1fr 95px}}


/* Probabilidade, progressões e porções */
.calc-intro{padding:3px 0}.calc-intro p{margin:4px 0 0;color:var(--m);font-size:14px}.dynamic-group{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.example-card{background:linear-gradient(135deg,var(--ps),var(--s));border:1px solid var(--b);border-radius:14px;padding:14px 16px;color:var(--m)}.example-card strong{color:var(--p)}.form textarea{width:100%;min-height:120px;resize:vertical;border:1px solid var(--b);border-radius:12px;background:var(--bg);color:var(--t);padding:12px 14px;font:inherit}.detail-steps{display:grid;gap:8px;text-align:left;width:100%;max-width:780px}.detail-steps>div{padding:9px 11px;border:1px solid var(--b);border-radius:10px;background:var(--s)}.detail-steps b{color:var(--p)}.sequence-list{display:flex;flex-wrap:wrap;gap:7px;justify-content:center;margin-bottom:12px}.sequence-list span{background:var(--ps);border:1px solid var(--b);border-radius:999px;padding:5px 10px;font-size:13px}.recipe-result{overflow-x:auto;margin-top:12px}.recipe-result table{width:100%;border-collapse:collapse;background:var(--s)}.recipe-result th,.recipe-result td{padding:10px 12px;border-bottom:1px solid var(--b);text-align:left}.recipe-result th:last-child,.recipe-result td:last-child{text-align:right}
@media(max-width:700px){.dynamic-group{grid-template-columns:1fr}}

/* Sono, probabilidade, ângulos e trigonometria */
.sleep-summary{display:flex;flex-direction:column;gap:.35rem;padding:1rem;border-radius:14px;background:color-mix(in srgb,var(--p) 10%,transparent);margin:.75rem 0}.sleep-summary span{font-size:.92rem;color:var(--muted)}.table-wrap{overflow:auto;margin:.8rem 0}.calc-table{width:100%;border-collapse:collapse;min-width:560px}.calc-table th,.calc-table td{padding:.7rem;border-bottom:1px solid var(--line);text-align:left}.calc-table th{font-size:.84rem;color:var(--muted)}.trig-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem;margin:.8rem 0}.trig-grid>div{display:flex;flex-direction:column;gap:.25rem;padding:.85rem;border:1px solid var(--line);border-radius:12px}.trig-grid span,.trig-grid small{color:var(--muted)}.trig-grid strong{font-size:1.18rem}.source-note{font-size:.86rem;color:var(--muted)}@media(max-width:700px){.trig-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Seletor de idioma */
.language-picker{position:relative;display:flex;align-items:center;gap:7px;min-height:42px;padding:0 10px;border:1px solid var(--b);border-radius:12px;background:var(--s)}
.language-picker select{max-width:175px;border:0;outline:0;background:transparent;color:var(--t);font:inherit;font-size:13px;font-weight:700;cursor:pointer}
.language-picker option{color:#172033;background:#fff}.language-picker>small{position:absolute;left:0;right:0;top:100%;padding-top:2px;text-align:center;color:var(--m);font-size:9px;white-space:nowrap}
.theme-button{min-width:44px}.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
html[data-language="zh-CN"] body,html[data-language="ja"] body,html[data-language="ko"] body{font-family:Inter,"Noto Sans CJK SC","Noto Sans CJK JP","Noto Sans CJK KR",system-ui,sans-serif}
@media(max-width:760px){.nav{gap:10px}.brand small{display:none}nav{gap:8px}.language-picker{padding:0 7px}.language-picker select{width:118px;max-width:118px;font-size:12px}.language-picker>span{display:none}.theme-button{padding:9px 11px}}
@media(max-width:430px){.brand{font-size:20px}.brand span b{font-size:13px}.language-picker select{width:105px}.container.nav{width:min(100% - 18px,1160px)}}

/* =========================================================
   Redesign profissional — ícones SVG monocromáticos
   ========================================================= */
:root{
  --p:#2563eb;
  --p-hover:#1d4ed8;
  --ps:#eff6ff;
  --bg:#f4f6f8;
  --s:#ffffff;
  --s2:#f8fafc;
  --t:#111827;
  --m:#667085;
  --b:#e2e8f0;
  --line:var(--b);
  --muted:var(--m);
  --icon:#273142;
  --icon-muted:#667085;
  --header-bg:rgba(255,255,255,.9);
  --shadow-sm:0 1px 2px rgba(15,23,42,.04),0 1px 3px rgba(15,23,42,.06);
  --shadow:0 14px 36px rgba(15,23,42,.08);
  --shadow-lg:0 24px 60px rgba(15,23,42,.11);
  --radius:18px;
  color-scheme:light;
}
html[data-theme=dark]{
  --p:#60a5fa;
  --p-hover:#93c5fd;
  --ps:#14233b;
  --bg:#0b1018;
  --s:#121925;
  --s2:#17202e;
  --t:#f1f5f9;
  --m:#9aa8bc;
  --b:#263244;
  --line:var(--b);
  --muted:var(--m);
  --icon:#d7dee8;
  --icon-muted:#9aa8bc;
  --header-bg:rgba(18,25,37,.9);
  --shadow-sm:0 1px 2px rgba(0,0,0,.2);
  --shadow:0 18px 42px rgba(0,0,0,.28);
  --shadow-lg:0 28px 70px rgba(0,0,0,.35);
  color-scheme:dark;
}
html{scroll-behavior:smooth}
body{font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;letter-spacing:-.008em;background:var(--bg)}
button,input,select,textarea{font:inherit}
button,a,input,select,textarea{transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease,color .18s ease,transform .18s ease,opacity .18s ease}
button{cursor:pointer}
::selection{background:color-mix(in srgb,var(--p) 22%,transparent)}
.container{width:min(1200px,calc(100% - 40px))}

/* SVGs */
.icon-svg,.brand-icon,.nav-control-icon,.tool-card-icon,.category-icon,.tool-page-icon,.related-svg,.button-icon,.search-icon{display:block;flex:0 0 auto;color:var(--icon)}
.brand-icon{width:25px;height:25px;stroke-width:1.75}
.nav-control-icon{width:18px;height:18px;color:var(--icon-muted)}
.tool-card-icon{width:25px;height:25px;stroke-width:1.7}
.category-icon{width:18px;height:18px;stroke-width:1.75}
.tool-page-icon{width:31px;height:31px;stroke-width:1.65}
.related-svg{width:18px;height:18px;stroke-width:1.7}
.button-icon{width:17px;height:17px}
.search-icon{width:21px;height:21px;color:var(--icon-muted)}

/* Cabeçalho */
header{z-index:20;background:var(--header-bg);border-bottom:1px solid color-mix(in srgb,var(--b) 86%,transparent);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.nav{min-height:76px;gap:28px}
.brand{gap:12px;font-size:inherit;min-width:max-content}
.logo-mark{width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--b);border-radius:14px;background:linear-gradient(145deg,var(--s),var(--s2));box-shadow:var(--shadow-sm);color:var(--icon)}
.logo-mark-small{width:38px;height:38px;border-radius:12px}
.brand-copy{gap:0!important;line-height:1.2}
.brand-copy b{font-size:16px;font-weight:800;letter-spacing:-.025em}
.brand-copy small{margin-top:4px;font-size:11px;letter-spacing:.015em;color:var(--m)}
nav{gap:12px}
.nav-links{display:flex;align-items:center;gap:6px}
.nav-links a{padding:9px 12px;border-radius:10px;color:var(--m);font-size:14px;font-weight:650}
.nav-links a:hover{background:var(--s2);color:var(--t)}
.language-picker{height:44px;min-height:44px;gap:8px;padding:0 11px;border-radius:12px;background:var(--s2);box-shadow:none}
.language-picker:focus-within{border-color:color-mix(in srgb,var(--p) 55%,var(--b));box-shadow:0 0 0 3px color-mix(in srgb,var(--p) 12%,transparent)}
.language-picker select{max-width:168px;color:var(--t);font-size:12.5px;font-weight:650}
.language-picker>small{top:calc(100% + 1px)}
.icon-button,.theme-button{width:44px;height:44px;min-width:44px;padding:0!important;display:grid;place-items:center;border:1px solid var(--b)!important;border-radius:12px!important;background:var(--s2)!important}
.icon-button:hover{border-color:#cbd5e1!important;background:var(--s)!important;transform:translateY(-1px)}
.theme-sun{display:none}
html[data-theme=dark] .theme-moon{display:none}
html[data-theme=dark] .theme-sun{display:block}

/* Hero */
.hero{position:relative;overflow:hidden;padding:92px 0 76px;background:var(--s);border-bottom:1px solid var(--b);text-align:center}
.hero::before,.hero::after{content:"";position:absolute;pointer-events:none;border-radius:999px;filter:blur(1px)}
.hero::before{width:520px;height:520px;left:-280px;top:-310px;background:radial-gradient(circle,color-mix(in srgb,var(--p) 12%,transparent),transparent 68%)}
.hero::after{width:460px;height:460px;right:-250px;bottom:-320px;background:radial-gradient(circle,color-mix(in srgb,var(--icon) 6%,transparent),transparent 70%)}
.hero-inner{position:relative;z-index:1}
.badge{padding:7px 12px;border:1px solid color-mix(in srgb,var(--p) 25%,var(--b));border-radius:999px;background:var(--ps);color:var(--p);font-size:11px;font-weight:800;letter-spacing:.1em}
.hero h1{max-width:850px;margin:20px auto 16px;font-size:clamp(40px,5.7vw,68px);font-weight:800;letter-spacing:-.055em;line-height:1.02}
.hero p{max-width:650px;margin:0 auto;color:var(--m);font-size:18px;letter-spacing:-.015em}
.search{max-width:760px;height:64px;margin:34px auto 0;padding:0 20px;align-items:center;gap:13px;border-radius:16px;background:var(--s);border:1px solid var(--b);box-shadow:0 14px 40px rgba(15,23,42,.09)}
html[data-theme=dark] .search{box-shadow:0 16px 40px rgba(0,0,0,.3)}
.search:focus-within{border-color:color-mix(in srgb,var(--p) 50%,var(--b));box-shadow:0 0 0 4px color-mix(in srgb,var(--p) 10%,transparent),var(--shadow)}
.search input{height:100%;font-size:16px;font-weight:500}
.search input::placeholder{color:color-mix(in srgb,var(--m) 76%,transparent)}
.search-message{min-height:22px;margin-top:11px;color:var(--m);font-size:13px}

/* Categorias e cartões */
.content{padding:64px 0 72px}
.group{margin-bottom:56px}
.group:last-child{margin-bottom:0}
.grouphead{min-height:46px;margin-bottom:18px;padding-bottom:13px;border-bottom:1px solid var(--b);align-items:center}
.group-title{display:flex;align-items:center;gap:10px}
.category-mark{width:34px;height:34px;display:grid;place-items:center;border:1px solid var(--b);border-radius:10px;background:var(--s);color:var(--icon);box-shadow:var(--shadow-sm)}
.group h2{margin:0;font-size:21px;font-weight:780;letter-spacing:-.03em}
.grouphead>span{padding:5px 9px;border-radius:999px;background:var(--s2);border:1px solid var(--b);font-size:11px;font-weight:650;color:var(--m)}
.grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}
.card{position:relative;min-height:158px;padding:21px;gap:16px;align-items:flex-start;border-radius:16px;background:var(--s);border:1px solid var(--b);box-shadow:var(--shadow-sm);overflow:hidden}
.card::after{content:"";position:absolute;inset:auto 0 0;height:2px;background:var(--p);transform:scaleX(0);transform-origin:left;transition:transform .2s ease}
.card:hover{border-color:color-mix(in srgb,var(--p) 36%,var(--b));box-shadow:var(--shadow);transform:translateY(-3px)}
.card:hover::after{transform:scaleX(1)}
.card-icon{width:48px;height:48px;display:grid;place-items:center;flex:0 0 48px;border:1px solid var(--b);border-radius:13px;background:linear-gradient(145deg,var(--s2),var(--s));color:var(--icon)}
.card-copy{min-width:0;display:flex;flex-direction:column;align-self:stretch}
.card h3{margin:1px 0 7px;font-size:16px;font-weight:750;letter-spacing:-.025em;line-height:1.3}
.card p{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;margin:0;color:var(--m);font-size:13px;line-height:1.5}
.card-link{margin-top:auto;padding-top:14px;color:var(--m);font-size:11.5px;font-weight:700}
.card:hover .card-link{color:var(--p)}
.seo{padding:64px 0;background:var(--s);border-top:1px solid var(--b)}
.prose{max-width:820px}
.prose h2{font-size:25px;letter-spacing:-.03em}

/* Página da ferramenta */
.page{padding:32px 0 88px}
.breadcrumb{display:flex;align-items:center;gap:6px;margin:2px 0 28px;color:var(--m);font-size:12.5px}
.breadcrumb a:hover{color:var(--p)}
.toolhead{margin:0 0 30px;align-items:center}
.toolhead-main{max-width:820px}
.tool-title-row{display:flex;align-items:center;gap:15px;margin-top:14px}
.tool-title-icon{width:58px;height:58px;display:grid;place-items:center;flex:0 0 58px;border:1px solid var(--b);border-radius:17px;background:linear-gradient(145deg,var(--s),var(--s2));box-shadow:var(--shadow-sm);color:var(--icon)}
.toolhead h1{margin:0;font-size:clamp(32px,4.6vw,50px);font-weight:800;letter-spacing:-.05em;line-height:1.05}
.toolhead p{max-width:760px;margin:13px 0 0;font-size:16px;line-height:1.6}
.fav{display:flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border-radius:12px!important;font-size:13px;font-weight:700;white-space:nowrap;box-shadow:var(--shadow-sm)}
.fav:hover{border-color:color-mix(in srgb,var(--p) 40%,var(--b));color:var(--p);transform:translateY(-1px)}
.layout{grid-template-columns:minmax(0,1fr) 310px;gap:26px;align-items:start}
.box,aside{border-radius:18px;border:1px solid var(--b);background:var(--s);box-shadow:var(--shadow-sm)}
.box{padding:30px}
aside{position:sticky;top:98px;padding:22px}
aside h2{margin:0 0 9px;font-size:15px;font-weight:760;letter-spacing:-.02em}
aside a{border-bottom:0}
.related-link{display:flex!important;align-items:center;gap:10px;margin:3px 0;padding:10px!important;border-radius:10px;color:var(--m);font-size:13px;font-weight:600}
.related-link:hover{background:var(--s2);color:var(--t)}
.related-icon{width:32px;height:32px;display:grid;place-items:center;flex:0 0 32px;border:1px solid var(--b);border-radius:9px;background:var(--s);color:var(--icon-muted)}
.related-name{min-width:0;flex:1;line-height:1.3}
.related-arrow{opacity:.45;font-size:14px}
.form{gap:17px}
.form label{gap:7px;color:var(--t);font-size:13px;font-weight:650}
.form input,.form select,.form textarea,.box select{border-radius:11px;border-color:var(--b);background:var(--s2);font-size:14px}
.form input,.form select,.box select{height:50px}
.form input:hover,.form select:hover,.form textarea:hover{border-color:#cbd5e1}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:color-mix(in srgb,var(--p) 60%,var(--b));box-shadow:0 0 0 3px color-mix(in srgb,var(--p) 11%,transparent);background:var(--s)}
.primary{min-height:52px;margin-top:22px;border-radius:11px;background:var(--p);font-size:14px;font-weight:750;letter-spacing:.005em;box-shadow:0 7px 18px color-mix(in srgb,var(--p) 22%,transparent)}
.primary:hover{background:var(--p-hover);transform:translateY(-1px);box-shadow:0 10px 24px color-mix(in srgb,var(--p) 27%,transparent)}
.primary:active{transform:translateY(0)}
.result{min-height:118px;margin-top:20px;border:1px solid var(--b);border-radius:13px;background:var(--s2);padding:20px}
.result strong{color:var(--t);font-size:28px;letter-spacing:-.03em}
.actions{margin-top:13px;gap:8px}
.actions button{min-height:40px;padding:0 13px;border-radius:10px;background:var(--s);font-size:12px;font-weight:650;color:var(--m)}
.actions button:hover{border-color:#cbd5e1;color:var(--t);background:var(--s2)}
article{max-width:850px;margin-top:54px}
article h2{margin-top:38px;margin-bottom:10px;font-size:23px;letter-spacing:-.03em}
article p{font-size:15px;line-height:1.75}
.notice{border:1px solid color-mix(in srgb,var(--p) 20%,var(--b));border-left:4px solid var(--p);border-radius:10px;background:var(--ps)}

/* Componentes internos */
.formula-box,.timer-display,.quadratic-chart,.metal-builder,.cost-details,.example-card,.dynamic-group,.gold-quote-panel{border-radius:13px}
.scientific-buttons button,.timer-controls button,.quote-head button{border-radius:9px}
.rule3-visual{border-radius:14px;background:var(--s2)}
.rule3-caption{border-radius:10px}
.detail-steps>div,.quadratic-steps>div{border-radius:9px}

/* Rodapé */
footer{padding:32px 0;background:var(--s);border-top:1px solid var(--b)}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:24px}
.footer-brand{display:flex;align-items:center;gap:12px}
.footer-brand b{display:block;color:var(--t);font-size:14px}
.footer-brand p{margin:2px 0 0;font-size:12px}
.footer-links{display:flex;align-items:center;gap:6px}
.footer-links a{padding:8px 10px;border-radius:9px;font-size:12px;font-weight:600}
.footer-links a:hover{background:var(--s2);color:var(--t)}

@media(max-width:980px){
  .nav-links{display:none}
  .grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .layout{grid-template-columns:1fr}
  aside{display:none}
}
@media(max-width:720px){
  .container{width:min(100% - 28px,1200px)}
  .nav{min-height:68px;gap:8px}
  .logo-mark{width:40px;height:40px;border-radius:12px}
  .brand-copy small{display:none}
  .brand-copy b{font-size:13px}
  nav{gap:7px}
  .language-picker{height:40px;min-height:40px;padding:0 8px}
  .language-picker .nav-control-icon{display:none}
  .language-picker select{width:112px;max-width:112px;font-size:11.5px}
  .icon-button,.theme-button{width:40px;height:40px;min-width:40px}
  .hero{padding:64px 0 54px}
  .hero h1{font-size:clamp(38px,12vw,52px)}
  .hero p{font-size:16px}
  .search{height:58px;margin-top:28px}
  .content{padding:46px 0 58px}
  .group{margin-bottom:44px}
  .grid{grid-template-columns:1fr}
  .card{min-height:142px}
  .toolhead{align-items:flex-start;flex-direction:column}
  .tool-title-row{align-items:flex-start}
  .tool-title-icon{width:50px;height:50px;flex-basis:50px;border-radius:14px}
  .tool-page-icon{width:27px;height:27px}
  .toolhead h1{font-size:34px}
  .fav{margin-left:65px}
  .box{padding:21px}
  .footer-inner{align-items:flex-start;flex-direction:column}
}
@media(max-width:470px){
  .container{width:min(100% - 20px,1200px)}
  .brand-copy{display:none!important}
  .language-picker select{width:102px;max-width:102px}
  .hero h1{font-size:38px}
  .grouphead>span{display:none}
  .card{padding:17px;gap:13px}
  .card-icon{width:44px;height:44px;flex-basis:44px}
  .tool-title-row{gap:11px}
  .tool-title-icon{width:45px;height:45px;flex-basis:45px}
  .toolhead h1{font-size:30px}
  .fav{margin-left:0}
  .form{grid-template-columns:1fr}
  .footer-links{flex-wrap:wrap}
}

/* =========================================================
   Identidade corporativa azul — redesign v2
   Modo claro: azul, branco e grafite
   Modo escuro: preto, carvão e cinza
   ========================================================= */
:root{
  --p:#0b67d0;
  --p-hover:#0758b5;
  --p-strong:#064b9b;
  --p-soft:#eaf4ff;
  --accent:#31a8ff;
  --ps:#eaf4ff;
  --bg:#f1f6fb;
  --s:#ffffff;
  --s2:#f7faff;
  --t:#0b1b33;
  --m:#5b6b80;
  --b:#d7e2ee;
  --line:var(--b);
  --muted:var(--m);
  --icon:#0b67d0;
  --icon-muted:#5b6b80;
  --header-bg:rgba(255,255,255,.94);
  --hero-a:#073b78;
  --hero-b:#0b67d0;
  --hero-c:#1889ef;
  --footer-bg:#082f61;
  --footer-text:#d9eaff;
  --shadow-sm:0 4px 14px rgba(20,61,104,.07);
  --shadow:0 16px 42px rgba(20,61,104,.13);
  --shadow-lg:0 28px 70px rgba(20,61,104,.18);
  color-scheme:light;
}
html[data-theme=dark]{
  --p:#d5d9df;
  --p-hover:#ffffff;
  --p-strong:#ffffff;
  --p-soft:#202226;
  --accent:#9298a1;
  --ps:#202226;
  --bg:#0b0c0e;
  --s:#131416;
  --s2:#1a1c1f;
  --t:#f1f2f4;
  --m:#a2a7af;
  --b:#303338;
  --line:var(--b);
  --muted:var(--m);
  --icon:#d9dde3;
  --icon-muted:#9ca2aa;
  --header-bg:rgba(13,14,16,.95);
  --hero-a:#050506;
  --hero-b:#121315;
  --hero-c:#25272b;
  --footer-bg:#050506;
  --footer-text:#c7cbd1;
  --shadow-sm:0 4px 14px rgba(0,0,0,.28);
  --shadow:0 18px 46px rgba(0,0,0,.42);
  --shadow-lg:0 30px 76px rgba(0,0,0,.55);
  color-scheme:dark;
}

body{background:var(--bg);color:var(--t)}
.container{width:min(1240px,calc(100% - 42px))}

/* Marca e navegação */
header{background:var(--header-bg);border-bottom:1px solid color-mix(in srgb,var(--b) 82%,transparent);box-shadow:0 4px 24px rgba(21,55,90,.05)}
html[data-theme=dark] header{box-shadow:0 4px 22px rgba(0,0,0,.35)}
.nav{min-height:82px;align-items:center}
.brand{display:inline-flex;align-items:center;gap:13px;height:54px;line-height:1;margin:0;padding:0}
.logo-mark.brand-emblem{position:relative;width:48px;height:48px;min-width:48px;flex:0 0 48px;display:grid;place-items:center;align-self:center;margin:0;border:0;border-radius:16px;background:linear-gradient(145deg,#147ce2,#0754ae);box-shadow:0 10px 24px rgba(11,103,208,.25),inset 0 1px 0 rgba(255,255,255,.3);color:#fff;overflow:hidden}
.logo-mark.brand-emblem::before{content:"";position:absolute;width:34px;height:34px;border:1px solid rgba(255,255,255,.23);border-radius:50%;inset:7px}
.logo-mark.brand-emblem .brand-orbit{position:absolute;width:42px;height:16px;border:1px solid rgba(255,255,255,.28);border-radius:50%;transform:rotate(-18deg)}
.logo-mark.brand-emblem .brand-icon{position:relative;z-index:2;width:27px;height:27px;color:#fff;stroke-width:1.85}
html[data-theme=dark] .logo-mark.brand-emblem{background:linear-gradient(145deg,#33363b,#17191c);box-shadow:0 10px 26px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.1)}
.brand-copy{height:45px;display:flex!important;flex-direction:column;justify-content:center;align-items:flex-start;gap:0!important;line-height:1.05!important}
.brand-copy b{display:block;font-size:17px;font-weight:850;letter-spacing:-.035em;white-space:nowrap;color:var(--t)}
.brand-copy small{display:block;margin-top:7px;font-size:10.5px;font-weight:650;letter-spacing:.055em;text-transform:uppercase;color:var(--m);white-space:nowrap}
.nav-links a{position:relative;color:var(--m);font-weight:700}
.nav-links a::after{content:"";position:absolute;left:12px;right:12px;bottom:4px;height:2px;border-radius:99px;background:var(--p);transform:scaleX(0);transition:.2s ease}
.nav-links a:hover{background:transparent;color:var(--p)}
.nav-links a:hover::after{transform:scaleX(1)}
.language-picker,.icon-button,.theme-button{background:var(--s)!important;border-color:var(--b)!important;box-shadow:var(--shadow-sm)}
html[data-theme=dark] .language-picker,html[data-theme=dark] .icon-button,html[data-theme=dark] .theme-button{background:var(--s2)!important}

/* Hero corporativo */
.hero{position:relative;padding:82px 0 0;text-align:left;border:0;background:linear-gradient(120deg,var(--hero-a) 0%,var(--hero-b) 58%,var(--hero-c) 100%);color:#fff;overflow:hidden}
html[data-theme=dark] .hero{background:linear-gradient(120deg,var(--hero-a),var(--hero-b) 58%,var(--hero-c));border-bottom:1px solid #26282c}
.hero::before{width:720px;height:720px;left:-280px;top:-420px;background:radial-gradient(circle,rgba(255,255,255,.17),transparent 66%);filter:none}
.hero::after{width:620px;height:620px;right:-210px;bottom:-410px;background:radial-gradient(circle,rgba(92,196,255,.34),transparent 68%);filter:none}
html[data-theme=dark] .hero::before{background:radial-gradient(circle,rgba(255,255,255,.08),transparent 66%)}
html[data-theme=dark] .hero::after{background:radial-gradient(circle,rgba(255,255,255,.07),transparent 68%)}
.hero-layout{position:relative;z-index:2;display:grid;grid-template-columns:1fr;gap:0;align-items:center}
.hero-copy{max-width:930px;padding-bottom:72px}
.hero .badge{display:inline-flex;align-items:center;min-height:30px;padding:0 12px;border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.12);color:#fff;backdrop-filter:blur(8px);font-size:10.5px;letter-spacing:.13em}
.hero h1{max-width:880px;margin:24px 0 18px;font-size:clamp(45px,5.7vw,72px);font-weight:860;line-height:.99;letter-spacing:-.062em;color:#fff}
.hero h1 span{display:block;color:#95d5ff}
html[data-theme=dark] .hero h1 span{color:#c7cbd1}
.hero p{max-width:720px;margin:0;color:rgba(255,255,255,.78);font-size:18px;line-height:1.7}
.hero .search{max-width:760px;height:66px;margin:34px 0 0;border:1px solid rgba(255,255,255,.28);border-radius:14px;background:#fff;box-shadow:0 20px 50px rgba(0,24,64,.28)}
html[data-theme=dark] .hero .search{background:#151618;border-color:#414348;box-shadow:0 22px 50px rgba(0,0,0,.55)}
.hero .search input{color:#10213a}
html[data-theme=dark] .hero .search input{color:#f2f3f5}
.hero .search-icon{color:#0b67d0}
html[data-theme=dark] .hero .search-icon{color:#c9cdd3}
.search-shortcut{display:inline-flex;align-items:center;justify-content:center;min-width:44px;height:28px;padding:0 7px;border:1px solid #d7e2ee;border-radius:7px;background:#f4f8fc;color:#6b7789;font-size:10px;font-weight:800;white-space:nowrap}
html[data-theme=dark] .search-shortcut{background:#24262a;border-color:#3c3f44;color:#b6bbc2}
.hero .search-message{margin:8px 0 0;color:rgba(255,255,255,.78)}
.hero-benefits{display:flex;flex-wrap:wrap;gap:22px;margin-top:20px;color:rgba(255,255,255,.83);font-size:12.5px;font-weight:650}
.hero-benefits span{display:flex;align-items:center;gap:7px}
.hero-benefits b{display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:rgba(255,255,255,.16);color:#bde5ff;font-size:11px}
html[data-theme=dark] .hero-benefits b{color:#f1f2f4}

/* Indicadores do hero */
.hero-stats{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(255,255,255,.2);background:rgba(0,20,55,.18)}
html[data-theme=dark] .hero-stats{background:rgba(0,0,0,.22);border-color:rgba(255,255,255,.1)}
.hero-stats div{display:flex;align-items:center;gap:12px;min-height:92px;padding:0 28px;border-right:1px solid rgba(255,255,255,.18)}
.hero-stats div:last-child{border-right:0}
.hero-stats strong{font-size:25px;color:#fff;letter-spacing:-.04em}.hero-stats span{max-width:135px;color:rgba(255,255,255,.69);font-size:11px;line-height:1.35}

/* Conteúdo e cartões */
.content{padding:80px 0 86px}
.section-intro{max-width:720px;margin:0 0 58px}
.section-intro>span,.seo-heading>span{color:var(--p);font-size:10.5px;font-weight:850;letter-spacing:.15em}
.section-intro h2,.seo-heading h2{margin:9px 0 12px;font-size:clamp(31px,4vw,47px);line-height:1.08;letter-spacing:-.052em}
.section-intro p{margin:0;color:var(--m);font-size:16px}
.group{margin-bottom:64px}
.grouphead{min-height:60px;margin-bottom:22px;padding:0 0 15px;border-bottom:1px solid var(--b)}
.group-title{gap:13px}
.group-title>div{display:flex;flex-direction:column;gap:3px}
.group-title small{color:var(--m);font-size:10.5px}
.category-mark{width:42px;height:42px;border:0;border-radius:12px;background:linear-gradient(145deg,#e8f4ff,#d9edff);box-shadow:none;color:#0b67d0}
html[data-theme=dark] .category-mark{background:linear-gradient(145deg,#2a2c30,#1e2023);color:#d4d7dc}
.group h2{font-size:22px}
.grouphead>span{background:var(--p-soft);border-color:color-mix(in srgb,var(--p) 18%,var(--b));color:var(--p)}
.grid{gap:19px}
.card{min-height:172px;padding:23px;border-radius:17px;border:1px solid var(--b);box-shadow:var(--shadow-sm);background:linear-gradient(180deg,var(--s) 0%,var(--s) 72%,color-mix(in srgb,var(--p-soft) 40%,var(--s)) 100%)}
html[data-theme=dark] .card{background:linear-gradient(180deg,#151618,#151618 72%,#1b1d20 100%)}
.card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,#2ca5ff,#0b67d0);opacity:0;transition:.22s ease}
html[data-theme=dark] .card::before{background:linear-gradient(180deg,#b2b7bf,#565a61)}
.card::after{height:0}
.card:hover{border-color:color-mix(in srgb,var(--p) 42%,var(--b));box-shadow:var(--shadow);transform:translateY(-5px)}
.card:hover::before{opacity:1}
.card-icon{width:52px;height:52px;flex-basis:52px;border:0;border-radius:14px;background:linear-gradient(145deg,#e7f4ff,#d7ecff);color:#0b67d0;box-shadow:inset 0 0 0 1px rgba(11,103,208,.08)}
html[data-theme=dark] .card-icon{background:linear-gradient(145deg,#292b2f,#1e2023);color:#d5d8dd;box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}
.card h3{font-size:17px}.card p{font-size:13px}.card-link{color:var(--p);font-size:12px}

/* Páginas internas */
.page{padding-top:34px}
.toolhead{position:relative;overflow:hidden;margin:0 0 30px;padding:34px 36px;border:0;border-radius:22px;background:linear-gradient(120deg,#073b78,#0b67d0 64%,#1688ec);box-shadow:0 22px 52px rgba(11,77,155,.2);color:#fff}
.toolhead::after{content:"";position:absolute;right:-100px;top:-170px;width:390px;height:390px;border:1px solid rgba(255,255,255,.14);border-radius:50%;box-shadow:0 0 0 42px rgba(255,255,255,.045),0 0 0 85px rgba(255,255,255,.025)}
html[data-theme=dark] .toolhead{background:linear-gradient(120deg,#070708,#151619 64%,#2a2c30);box-shadow:0 22px 52px rgba(0,0,0,.48)}
.toolhead-main,.toolhead>.fav{position:relative;z-index:2}
.toolhead .badge{border-color:rgba(255,255,255,.26);background:rgba(255,255,255,.13);color:#fff}
.tool-title-icon{border:1px solid rgba(255,255,255,.24);background:rgba(255,255,255,.13);box-shadow:none;color:#fff;backdrop-filter:blur(8px)}
.toolhead h1{color:#fff}.toolhead p{color:rgba(255,255,255,.77)}
.toolhead .fav{border:1px solid rgba(255,255,255,.32)!important;background:rgba(255,255,255,.12)!important;color:#fff;box-shadow:none;backdrop-filter:blur(8px)}
.toolhead .fav .button-icon{color:#fff}
.toolhead .fav:hover{background:#fff!important;color:#0b67d0}
.toolhead .fav:hover .button-icon{color:#0b67d0}
html[data-theme=dark] .toolhead .fav:hover{color:#151619}
.box,aside{position:relative;border-color:var(--b);box-shadow:var(--shadow-sm)}
.box{overflow:hidden;padding:32px}
.box::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,#0b67d0,#42b4ff)}
html[data-theme=dark] .box::before{background:linear-gradient(90deg,#777c84,#d0d3d8)}
.form input,.form select,.form textarea,.box select{background:var(--s2)}
.primary{background:linear-gradient(90deg,#0758b5,#0b74df);box-shadow:0 10px 25px rgba(11,103,208,.24)}
.primary:hover{background:linear-gradient(90deg,#064d9f,#0866c7)}
html[data-theme=dark] .primary{background:linear-gradient(90deg,#d2d5da,#fff);color:#111214;box-shadow:0 10px 25px rgba(0,0,0,.35)}
html[data-theme=dark] .primary:hover{background:#fff;color:#050506}
.result{background:linear-gradient(145deg,var(--s2),color-mix(in srgb,var(--p-soft) 48%,var(--s)))}
html[data-theme=dark] .result{background:linear-gradient(145deg,#191b1e,#202226)}
.result strong{color:var(--p-strong)}
html[data-theme=dark] .result strong{color:#f4f5f6}
.related-icon{background:var(--p-soft);color:var(--p)}
html[data-theme=dark] .related-icon{background:#25272a;color:#d5d8dd}

/* SEO e rodapé */
.seo{padding:82px 0;background:linear-gradient(135deg,#e7f3ff,#f7fbff);border-top:1px solid #d4e7f8}
html[data-theme=dark] .seo{background:linear-gradient(135deg,#111214,#1c1e21);border-color:#2d3035}
.seo-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:80px;align-items:start}
.seo-heading h2{max-width:540px}.seo .prose{max-width:none}.seo .prose p{font-size:16px;line-height:1.75}
.seo-link{display:inline-flex;gap:10px;align-items:center;margin-top:10px;color:var(--p);font-weight:800;font-size:13px}
footer{background:var(--footer-bg);border:0;color:var(--footer-text)}
.footer-brand b{color:#fff}.footer-brand p{color:rgba(255,255,255,.64)}.footer-links a{color:rgba(255,255,255,.72)}.footer-links a:hover{background:rgba(255,255,255,.09);color:#fff}
footer .logo-mark.brand-emblem,footer .logo-mark{border-color:rgba(255,255,255,.18);background:rgba(255,255,255,.08);color:#fff;box-shadow:none}

@media(max-width:1080px){
  .hero-layout{grid-template-columns:1fr;gap:0}
  .hero-copy{max-width:900px;padding-bottom:58px}
}
@media(max-width:900px){
  .hero-stats{grid-template-columns:repeat(2,1fr)}
  .hero-stats div:nth-child(2){border-right:0}.hero-stats div:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.18)}
  .seo-layout{grid-template-columns:1fr;gap:24px}
}
@media(max-width:720px){
  .container{width:min(100% - 28px,1240px)}
  .nav{min-height:72px}
  .brand{height:46px;gap:10px}
  .logo-mark.brand-emblem{width:42px;height:42px;min-width:42px;flex-basis:42px;border-radius:13px}
  .logo-mark.brand-emblem::before{width:30px;height:30px;inset:6px}.logo-mark.brand-emblem .brand-orbit{width:36px;height:14px}
  .brand-copy{height:40px}.brand-copy b{font-size:14px}.brand-copy small{font-size:8.5px;margin-top:6px}
  .hero{padding-top:58px}.hero h1{font-size:clamp(40px,12vw,56px)}.hero-copy{padding-bottom:48px}
  .hero-stats div{padding:0 17px;min-height:82px}.hero-stats strong{font-size:21px}.hero-stats span{font-size:10px}
  .section-intro{margin-bottom:42px}.content{padding-top:58px}
  .toolhead{padding:28px 24px}.tool-title-row{align-items:center}.toolhead h1{font-size:34px}.toolhead .fav{margin-left:0}
  .seo{padding:60px 0}
}
@media(max-width:500px){
  .brand-copy{display:flex!important}.brand-copy small{display:none}.brand-copy{height:auto}.brand-copy b{font-size:12.5px;max-width:118px;white-space:normal;line-height:1.05}
  .language-picker select{width:96px;max-width:96px}.theme-button{width:38px;height:38px;min-width:38px}.language-picker{height:38px;min-height:38px}
  .hero h1{font-size:39px}.hero p{font-size:15px}.search-shortcut{display:none}.hero .search{height:60px;padding:0 15px}
  .hero-stats{margin-left:-14px;margin-right:-14px}.hero-stats div{align-items:flex-start;justify-content:center;flex-direction:column;gap:3px;padding:13px 15px}.hero-stats span{max-width:none}
  .group-title small{display:none}.grouphead{min-height:54px}.category-mark{width:38px;height:38px}.card{min-height:158px}
  .toolhead{padding:24px 20px}.tool-title-icon{width:47px;height:47px;flex-basis:47px}.toolhead h1{font-size:29px}.toolhead p{font-size:14px}
}
footer .brand-icon{color:#fff}
html[data-theme=dark] .gold-quote-panel{background:linear-gradient(145deg,#191a1d,#222428);border-color:#3c3f44}
html[data-theme=dark] .gold-quote-compact strong{color:#e2e4e7}
html[data-theme=dark] .gold-quote-compact>div{background:#191a1c}

/* ===== HERO COM ANOTAÇÕES DE GIZ ===== */
.hero{
  position:relative;
  isolation:isolate;
  overflow:hidden;
}
.hero::before,
.hero::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
}
.hero::before{
  z-index:0;
  background-image:url('/chalk-notes-day.png');
  background-repeat:no-repeat;
  background-size:cover;
  background-position:center top;
  opacity:.17;
}
html[data-theme=dark] .hero::before{
  background-image:url('/chalk-notes-night.png');
  opacity:.28;
}
.hero::after{
  z-index:1;
  background:
    radial-gradient(circle at 12% 16%, rgba(255,255,255,.14), transparent 34%),
    radial-gradient(circle at 88% 80%, rgba(255,255,255,.07), transparent 38%),
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,0) 36%);
}
html[data-theme=dark] .hero::after{
  background:
    radial-gradient(circle at 12% 16%, rgba(255,255,255,.06), transparent 34%),
    radial-gradient(circle at 88% 80%, rgba(255,255,255,.04), transparent 38%),
    linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,0) 36%);
}
.hero-layout{
  position:relative;
  z-index:2;
}
.hero h1{
  max-width:980px;
  text-wrap:balance;
}
.hero h1 span{
  display:inline;
  color:#d6eeff;
}
html[data-theme=dark] .hero h1 span{
  color:#d4d7dd;
}
.hero p{
  max-width:760px;
}
@media (max-width: 780px){
  .hero::before{
    background-size:180%;
    background-position:center top;
    opacity:.13;
  }
  html[data-theme=dark] .hero::before{
    opacity:.24;
  }
  .hero h1 span{
    display:block;
    margin-top:8px;
  }
}

/* ===== AJUSTE HERO COM IMAGEM COMPLETA, 30% MAIS BAIXO E CENTRALIZADO ===== */
.hero{
  padding:56px 0 0 !important;
  text-align:center !important;
  min-height:auto;
}
.hero::before,
.hero::after{
  border-radius:0 !important;
  filter:none !important;
  width:auto !important;
  height:auto !important;
  left:0 !important;
  right:0 !important;
  top:0 !important;
  bottom:0 !important;
}
.hero::before{
  inset:0;
  background:url('/hero-chalk-wide.png') center center / cover no-repeat !important;
  opacity:.36 !important;
}
.hero::after{
  inset:0;
  background:linear-gradient(180deg, rgba(4,36,86,.12), rgba(7,56,120,.06) 28%, rgba(5,53,116,.08) 100%) !important;
  opacity:1 !important;
}
html[data-theme=dark] .hero::before{
  background:url('/chalk-notes-night.png') center center / cover no-repeat !important;
  opacity:.12 !important;
}
html[data-theme=dark] .hero::after{
  background:linear-gradient(180deg, rgba(0,0,0,.18), rgba(0,0,0,.12) 30%, rgba(0,0,0,.18) 100%) !important;
}
.hero-layout{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
}
.hero-copy{
  width:100%;
  max-width:1100px !important;
  margin:0 auto !important;
  padding-bottom:42px !important;
  text-align:center !important;
}
.hero .badge{
  margin:0 auto;
}
.hero h1{
  max-width:1020px !important;
  margin:18px auto 14px !important;
  font-size:clamp(42px,5.2vw,74px) !important;
  line-height:1.0 !important;
  text-wrap:balance;
}
.hero h1 span{
  display:inline !important;
}
.hero p{
  max-width:860px !important;
  margin:0 auto !important;
  font-size:19px !important;
}
.hero .search{
  max-width:820px !important;
  margin:26px auto 0 !important;
}
.hero-benefits{
  justify-content:center !important;
  margin-top:18px !important;
}
.hero-stats{
  width:100%;
  max-width:1220px;
  margin:0 auto;
}
.hero-stats div{
  min-height:68px !important;
  padding:0 24px !important;
}
.hero-stats strong{
  font-size:19px !important;
}
.hero-stats span{
  max-width:none !important;
  font-size:10.5px !important;
}
@media (max-width: 980px){
  .hero{padding:48px 0 0 !important;}
  .hero-copy{padding-bottom:34px !important;}
  .hero h1{font-size:clamp(38px,8vw,58px) !important; max-width:760px !important;}
  .hero p{font-size:17px !important; max-width:720px !important;}
  .hero .search{max-width:740px !important;}
  .hero-stats div{min-height:62px !important;}
}
@media (max-width: 650px){
  .hero{padding:40px 0 0 !important;}
  .hero-copy{padding-bottom:26px !important;}
  .hero h1{font-size:clamp(34px,10vw,48px) !important;}
  .hero p{font-size:15px !important;}
  .hero .search{height:58px !important;}
  .hero-stats div{min-height:58px !important; padding:12px 14px !important;}
  .hero-stats strong{font-size:18px !important;}
}

/* ===== HERO REFINADO COM IMAGEM COMPLETA E MENOR ALTURA ===== */
.hero{
  position:relative;
  padding:56px 0 0;
  text-align:center;
  background:
    linear-gradient(90deg, rgba(6,71,150,.16), rgba(24,137,239,.10)),
    url('/hero-chalk-full.webp') center center / cover no-repeat;
  color:#fff;
  overflow:hidden;
}
html[data-theme=dark] .hero{
  background:
    linear-gradient(90deg, rgba(8,10,12,.56), rgba(26,28,31,.40)),
    url('/hero-chalk-full.webp') center center / cover no-repeat;
}
.hero::before,
.hero::after{content:none !important;}
.hero-layout{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:1fr;
  gap:0;
  align-items:center;
}
.hero-copy{
  max-width:1120px;
  margin:0 auto;
  padding-bottom:40px;
}
.hero .badge{
  margin:0 auto;
}
.hero h1{
  max-width:1120px;
  margin:18px auto 14px;
  font-size:clamp(40px,5.1vw,74px);
  font-weight:860;
  line-height:1.0;
  letter-spacing:-.06em;
  color:#fff;
}
.hero h1 span{
  display:block;
  color:#d8ecff;
}
html[data-theme=dark] .hero h1 span{color:#d2d5da;}
.hero p{
  max-width:900px;
  margin:0 auto;
  color:rgba(255,255,255,.88);
  font-size:17px;
  line-height:1.6;
}
.hero .search{
  max-width:860px;
  height:62px;
  margin:28px auto 0;
  border:1px solid rgba(255,255,255,.24);
  border-radius:14px;
  background:#fff;
  box-shadow:0 16px 40px rgba(0,24,64,.18);
}
html[data-theme=dark] .hero .search{
  background:#141517;
  border-color:#3b3e43;
  box-shadow:0 18px 42px rgba(0,0,0,.48);
}
.hero .search input{font-size:16px;}
.hero .search-message{
  margin:8px auto 0;
  color:rgba(255,255,255,.78);
}
.hero-benefits{
  justify-content:center;
  gap:20px;
  margin-top:18px;
  color:rgba(255,255,255,.84);
  font-size:12px;
}
.hero-benefits b{
  background:rgba(255,255,255,.18);
}
.hero-stats{
  grid-column:1/-1;
  width:min(1120px,100%);
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  border-top:1px solid rgba(255,255,255,.18);
  background:rgba(7,48,112,.22);
  backdrop-filter:blur(4px);
}
html[data-theme=dark] .hero-stats{
  background:rgba(0,0,0,.22);
  border-color:rgba(255,255,255,.08);
}
.hero-stats div{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:66px;
  padding:0 22px;
  border-right:1px solid rgba(255,255,255,.14);
}
.hero-stats div:last-child{border-right:0;}
.hero-stats strong{font-size:19px;color:#fff;letter-spacing:-.03em;}
.hero-stats span{max-width:130px;color:rgba(255,255,255,.76);font-size:10.5px;line-height:1.35;}

@media (max-width: 980px){
  .hero{padding-top:46px;}
  .hero-copy{padding-bottom:32px;max-width:100%;}
  .hero h1{font-size:clamp(38px,7.8vw,60px);max-width:100%;}
  .hero p,.hero .search{max-width:100%;}
  .hero-stats{grid-template-columns:repeat(2,1fr);}
  .hero-stats div:nth-child(2){border-right:0;}
  .hero-stats div:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.14);}
}
@media (max-width: 640px){
  .hero{padding-top:38px;}
  .hero h1{font-size:clamp(34px,11vw,48px);}
  .hero p{font-size:15px;line-height:1.55;}
  .hero .search{height:58px;}
  .hero-benefits{gap:14px;justify-content:center;}
  .hero-stats{width:calc(100% + 28px);margin-left:-14px;margin-right:-14px;}
  .hero-stats div{min-height:58px;padding:10px 14px;align-items:flex-start;justify-content:center;flex-direction:column;gap:3px;}
  .hero-stats strong{font-size:18px;}
  .hero-stats span{font-size:10px;max-width:none;}
}
.bohr-model{position:relative;width:220px;height:220px;margin:18px auto;display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle,var(--ps),transparent 65%)}
.bohr-model>b{position:relative;z-index:5;display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:var(--p);color:#fff;font-size:20px}
.bohr-ring{position:absolute;border:1px solid color-mix(in srgb,var(--p) 55%,transparent);border-radius:50%;width:calc(68px + var(--i)*22px);height:calc(68px + var(--i)*22px)}
.bohr-ring::after{content:attr(style);font-size:0;position:absolute;width:8px;height:8px;border-radius:50%;background:var(--p);left:50%;top:-4px;box-shadow:12px 8px 0 color-mix(in srgb,var(--p) 75%,white),-12px 8px 0 color-mix(in srgb,var(--p) 75%,white)}
html[data-theme=dark] .bohr-model{background:radial-gradient(circle,#24262a,transparent 65%)}
.bohr-model{position:relative;width:220px;height:220px;margin:18px auto;display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle,var(--ps),transparent 65%)}
.bohr-model>b{position:relative;z-index:5;display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:var(--p);color:#fff;font-size:20px}
.bohr-ring{position:absolute;border:1px solid color-mix(in srgb,var(--p) 55%,transparent);border-radius:50%;width:calc(68px + var(--i)*22px);height:calc(68px + var(--i)*22px)}
.bohr-ring::after{content:"";position:absolute;width:8px;height:8px;border-radius:50%;background:var(--p);left:50%;top:-4px;box-shadow:12px 8px 0 color-mix(in srgb,var(--p) 75%,white),-12px 8px 0 color-mix(in srgb,var(--p) 75%,white)}
html[data-theme=dark] .bohr-model{background:radial-gradient(circle,#24262a,transparent 65%)}

/* ===== CONTEÚDO EDITORIAL E SEO DAS CALCULADORAS ===== */
.calculator-guide{margin:42px 0 28px;padding:34px;border:1px solid var(--b);border-radius:22px;background:var(--s);box-shadow:0 14px 38px rgba(20,52,90,.07)}
.calculator-guide .guide-intro{max-width:900px;margin-bottom:24px}.calculator-guide .eyebrow{display:block;margin-bottom:8px;color:var(--p);font-size:11px;font-weight:850;letter-spacing:.12em}.calculator-guide h2{margin:26px 0 10px;font-size:clamp(21px,3vw,28px);letter-spacing:-.03em}.calculator-guide p{color:var(--m);line-height:1.75}.guide-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:28px}.steps,.seo-list{margin:12px 0 0;padding-left:22px;color:var(--m);line-height:1.75}.calculator-guide details{border-top:1px solid var(--b);padding:14px 0}.calculator-guide details:last-of-type{border-bottom:1px solid var(--b)}.calculator-guide summary{cursor:pointer;font-weight:750;color:var(--t)}.calculator-guide details p{margin:9px 0 0}.methodology-link{margin-top:22px!important;font-size:14px}.methodology-link a{font-weight:750;color:var(--p)}
html[data-theme=dark] .calculator-guide{box-shadow:0 16px 40px rgba(0,0,0,.25)}
@media(max-width:780px){.calculator-guide{padding:24px 20px}.guide-grid{grid-template-columns:1fr;gap:0}}

/* Estruturas covalentes e Lewis */
.chem-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:16px 0}
.chem-summary>div{padding:13px;border:1px solid var(--b);border-radius:12px;background:var(--s);display:flex;flex-direction:column;gap:4px}
.chem-summary span{font-size:11px;color:var(--m)}.chem-summary strong{font-size:20px;color:var(--t)}
.chemical-formulas{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:18px 0}
.chemical-formulas section{padding:15px;border:1px solid var(--b);border-radius:16px;background:var(--s)}
.chemical-formulas h3{margin:0 0 8px;font-size:16px}.chemical-formulas p{margin:6px 0 0;color:var(--m);font-size:12px;line-height:1.5}
.molecule-svg{display:block;width:100%;max-width:360px;height:auto;margin:auto;color:var(--t)}
.molecule-svg line{stroke:currentColor;stroke-width:3;stroke-linecap:round}.molecule-svg text{fill:currentColor;font-size:23px;font-weight:800;font-family:system-ui,sans-serif}.molecule-svg circle{fill:currentColor}
.chem-steps{padding:14px 16px;border-left:4px solid var(--p);background:var(--ps);border-radius:10px}.chem-steps ol{margin:8px 0 0;padding-left:20px}.chem-steps li{margin:5px 0}
@media(max-width:760px){.chem-summary{grid-template-columns:repeat(2,1fr)}.chemical-formulas{grid-template-columns:1fr}}

/* ===== CALCULADORA COMPLETA DE LIGAÇÕES COVALENTES ===== */
.chem-summary.expanded{grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:12px;margin:18px 0}
.chem-summary.expanded>div{min-height:74px;justify-content:center;background:linear-gradient(145deg,var(--s),color-mix(in srgb,var(--ps) 48%,var(--s)))}
.chem-summary.expanded strong sub,.chem-summary.expanded strong sup{font-size:.62em}
.chemical-formulas.complete{grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch}
.chemical-formulas.complete section{display:flex;flex-direction:column;min-height:360px;background:linear-gradient(160deg,var(--s),color-mix(in srgb,var(--ps) 44%,var(--s)))}
.chemical-formulas.complete .molecule-svg{flex:1;min-height:250px}
.molecule-svg.detailed{overflow:visible;color:var(--t)}
.molecule-svg .bond-line{stroke:currentColor;stroke-width:3.2;stroke-linecap:round}
.molecule-svg .electron{fill:var(--p);stroke:none}
html[data-theme=dark] .molecule-svg .electron{fill:#e0e3e8}
.molecule-svg .shared{fill:color-mix(in srgb,var(--p) 82%,var(--t))}
.molecule-svg .atom-label{fill:currentColor;font-size:24px;font-weight:850;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;paint-order:stroke;stroke:var(--s);stroke-width:7px;stroke-linejoin:round}
.molecule-svg .formal-charge,.molecule-svg .ion-charge{fill:var(--p);font-size:16px;font-weight:900;font-family:system-ui,sans-serif}
.molecule-svg .ion-bracket{fill:none;stroke:currentColor;stroke-width:2.3;stroke-linecap:round}
.chem-explanation{margin:18px 0;padding:19px 20px;border:1px solid var(--b);border-radius:16px;background:var(--s)}
.chem-explanation h3{margin:0 0 12px;font-size:17px;color:var(--t)}
.chem-explanation p{margin:8px 0;color:var(--m);line-height:1.68}
.chem-explanation ol,.chem-explanation ul{margin:8px 0;padding-left:22px;color:var(--m);line-height:1.65}
.chem-explanation li{margin:6px 0}
.equation-line{margin-top:12px;padding:12px 14px;border-radius:10px;background:var(--ps);color:var(--t);line-height:1.6}
.chem-table-wrap{overflow-x:auto;border:1px solid var(--b);border-radius:12px}
.chem-table{width:100%;border-collapse:collapse;min-width:560px;background:var(--s)}
.chem-table th,.chem-table td{padding:10px 12px;border-bottom:1px solid var(--b);text-align:center;font-size:13px}
.chem-table thead th{background:var(--ps);color:var(--t);font-weight:800}
.chem-table tbody td{color:var(--m)}
.chem-table tfoot th{background:color-mix(in srgb,var(--ps) 70%,var(--s));color:var(--t)}
.chem-properties{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px}
.chem-properties>div{padding:13px;border:1px solid var(--b);border-radius:12px;background:var(--ps);display:flex;flex-direction:column;gap:5px}
.chem-properties span{font-size:11px;color:var(--m)}
.chem-properties strong{font-size:14px;color:var(--t);line-height:1.35}
.chem-alert{margin:16px 0;padding:15px 17px;border-left:4px solid var(--p);border-radius:10px;background:var(--ps);color:var(--m);line-height:1.65}
.chem-alert strong{color:var(--t)}
.chem-notes{margin:16px 0;padding:16px 18px;border:1px solid var(--b);border-radius:12px;background:var(--s)}
.chem-notes strong{color:var(--t)}
.chem-notes ul{margin:8px 0 0;padding-left:20px;color:var(--m);line-height:1.6}
@media(max-width:820px){.chemical-formulas.complete{grid-template-columns:1fr}.chemical-formulas.complete section{min-height:330px}.chem-summary.expanded{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:460px){.chem-summary.expanded{grid-template-columns:1fr}.chem-explanation{padding:16px 14px}.molecule-svg.detailed{min-height:220px}}

/* Resultado detalhado e acionamento resiliente da calculadora covalente */
.covalent-calculate{position:relative;min-height:58px;font-size:16px}
.covalent-calculate.is-loading{opacity:.78;cursor:wait}
.covalent-calculate.is-loading::after{content:"";display:inline-block;width:16px;height:16px;margin-left:10px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;vertical-align:-3px;animation:covSpin .75s linear infinite}
@keyframes covSpin{to{transform:rotate(360deg)}}
.covalent-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:120px;text-align:center;color:var(--m)}
.covalent-empty strong{color:var(--t);font-size:17px}
.result.covalent-result{padding:0;overflow:hidden;text-align:left;background:var(--s)}
.covalent-result-heading{padding:24px 26px;background:linear-gradient(120deg,var(--p),color-mix(in srgb,var(--p) 70%,#42a5ff));color:#fff}
html[data-theme=dark] .covalent-result-heading{background:linear-gradient(120deg,#17191d,#34373d)}
.covalent-result-heading .result-kicker{display:block;margin-bottom:7px;font-size:10px;font-weight:850;letter-spacing:.13em;opacity:.82}
.covalent-result-heading h2{margin:0;font-size:clamp(22px,3vw,31px);line-height:1.15;color:#fff}
.covalent-result-heading p{margin:8px 0 0;color:rgba(255,255,255,.82);font-size:13px}
.covalent-result-body{padding:22px}
.covalent-result-body>.chem-summary:first-child{margin-top:0}
@media(max-width:640px){.covalent-result-heading{padding:20px 17px}.covalent-result-body{padding:14px}.covalent-calculate{min-height:54px}}


/* Nomenclatura covalente por prefixos e sufixos */
.nomenclature-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;margin:12px 0 16px}
.nomenclature-grid>div{padding:14px;border:1px solid var(--b);border-radius:12px;background:var(--ps);display:flex;flex-direction:column;gap:5px}
.nomenclature-grid span{font-size:11px;color:var(--m);text-transform:uppercase;letter-spacing:.04em}
.nomenclature-grid strong{font-size:15px;color:var(--t);line-height:1.4}
.nomenclature-rules{margin-top:16px;padding-top:14px;border-top:1px solid var(--b)}
.nomenclature-rules h4{margin:0 0 10px;color:var(--t);font-size:14px}
.prefix-chips{display:flex;flex-wrap:wrap;gap:7px;margin:0 0 12px}
.prefix-chips span{display:inline-flex;align-items:center;gap:5px;padding:7px 9px;border:1px solid var(--b);border-radius:999px;background:var(--s);font-size:12px;color:var(--m)}
.prefix-chips b{display:grid;place-items:center;min-width:19px;height:19px;border-radius:50%;background:var(--p);color:#fff;font-size:10px}
@media(max-width:520px){.nomenclature-grid{grid-template-columns:1fr}.prefix-chips span{font-size:11px}}

/* =========================================================
   Menu suspenso de categorias
   ========================================================= */
html{scroll-behavior:smooth;scroll-padding-top:104px}
.group{scroll-margin-top:104px}
.nav-links{display:flex;align-items:center;gap:4px}
.category-menu{position:relative;z-index:30}
.category-menu>summary{list-style:none;display:flex;align-items:center;gap:8px;height:42px;padding:0 12px;border-radius:11px;color:var(--m);font-weight:750;cursor:pointer;user-select:none;transition:background .18s ease,color .18s ease}
.category-menu>summary::-webkit-details-marker{display:none}
.category-menu>summary:hover,.category-menu[open]>summary{background:var(--ps);color:var(--p)}
.category-menu-grid{display:grid;place-items:center}
.category-menu-chevron{width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .18s ease}
.category-menu[open] .category-menu-chevron{transform:rotate(225deg) translate(-1px,-1px)}
.category-dropdown{position:absolute;top:calc(100% + 15px);right:-185px;width:min(850px,calc(100vw - 34px));padding:18px;border:1px solid var(--b);border-radius:18px;background:var(--s);box-shadow:0 24px 70px rgba(15,36,70,.20);color:var(--t);animation:categoryDrop .16s ease-out;overflow:hidden}
html[data-theme=dark] .category-dropdown{box-shadow:0 28px 76px rgba(0,0,0,.58)}
.category-dropdown::before{content:"";position:absolute;top:-7px;right:220px;width:13px;height:13px;border-left:1px solid var(--b);border-top:1px solid var(--b);background:var(--s);transform:rotate(45deg)}
.category-dropdown-head{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:2px 4px 14px;border-bottom:1px solid var(--b)}
.category-dropdown-head>div{display:flex;flex-direction:column;line-height:1.35}
.category-dropdown-head strong{font-size:15px}
.category-dropdown-head small{color:var(--m);font-size:11px}
.category-dropdown-head>a{display:inline-flex!important;align-items:center;min-height:34px;padding:0 11px!important;border:1px solid var(--b);border-radius:9px;color:var(--p)!important;font-size:11px;font-weight:800;white-space:nowrap}
.category-dropdown-head>a:hover{background:var(--ps)!important}
.category-dropdown-grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;margin-top:12px;max-height:min(62vh,520px);overflow:auto;overscroll-behavior:contain;padding-right:3px}
.category-dropdown-link{display:flex!important;align-items:center;gap:10px;min-width:0;padding:9px 10px!important;border-radius:11px;color:var(--t)!important;transition:background .15s ease,transform .15s ease}
.category-dropdown-link::after{display:none!important}
.category-dropdown-link:hover{background:var(--ps)!important;color:var(--p)!important;transform:translateY(-1px)}
.category-dropdown-icon{display:grid;place-items:center;flex:0 0 34px;width:34px;height:34px;border-radius:10px;background:var(--ps);color:var(--p)}
.category-menu-icon{display:block;width:18px;height:18px}
.category-dropdown-copy{display:flex;min-width:0;flex-direction:column;line-height:1.25}
.category-dropdown-copy strong{overflow:hidden;text-overflow:ellipsis;font-size:12px;white-space:nowrap}
.category-dropdown-copy small{margin-top:2px;color:var(--m);font-size:9.5px;white-space:nowrap}
@keyframes categoryDrop{from{opacity:0;transform:translateY(-6px) scale(.985)}to{opacity:1;transform:none}}

@media(max-width:980px){
  .category-dropdown{right:-135px;width:min(720px,calc(100vw - 28px))}
  .category-dropdown::before{right:170px}
  .category-dropdown-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  .home-nav-link{display:none!important}
  .category-menu>summary{width:42px;padding:0;justify-content:center;border:1px solid var(--b);background:var(--s);box-shadow:var(--shadow-sm)}
  html[data-theme=dark] .category-menu>summary{background:var(--s2)}
  .category-menu-label,.category-menu-chevron{display:none}
  .category-dropdown{position:fixed;top:76px;left:14px;right:14px;width:auto;max-height:calc(100vh - 92px);padding:14px;border-radius:16px}
  .category-dropdown::before{display:none}
  .category-dropdown-grid{grid-template-columns:1fr 1fr;max-height:calc(100vh - 178px)}
  .category-dropdown a{display:flex!important}
}
@media(max-width:500px){
  .category-dropdown{top:70px;left:9px;right:9px;padding:12px}
  .category-dropdown-grid{grid-template-columns:1fr;max-height:calc(100vh - 168px)}
  .category-dropdown-head{padding-bottom:10px}
  .category-dropdown-link{padding:8px!important}
}