/* BQ Calculator v1.2 premium interaction layer */
html{scroll-padding-top:146px}
body[data-calculator] .page-hero{padding-bottom:18px}
body[data-calculator] .calculator-capabilities{border-top:1px solid color-mix(in srgb,var(--border) 65%,transparent);border-bottom:1px solid color-mix(in srgb,var(--border) 65%,transparent);background:color-mix(in srgb,var(--surface) 70%,transparent)}
body[data-calculator] .calculator-capabilities .container{display:flex;gap:10px 18px;align-items:center;flex-wrap:wrap;min-height:48px;color:var(--muted);font-size:.83rem;font-weight:750}

.premium-jumpbar{position:sticky;top:74px;z-index:65;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(16px);border-bottom:1px solid var(--border)}
.premium-jumpbar .container{display:flex;gap:4px;overflow:auto;scrollbar-width:none;padding-top:7px;padding-bottom:7px}
.premium-jumpbar .container::-webkit-scrollbar{display:none}
.premium-jumpbar a{flex:0 0 auto;padding:7px 12px;border-radius:999px;color:var(--muted);font-size:.82rem;font-weight:800;transition:background .15s ease,color .15s ease}
.premium-jumpbar a:hover,.premium-jumpbar a:focus-visible{background:var(--surface-2);color:var(--text)}

body[data-calculator] .calculator-shell{gap:22px}
body[data-calculator] .panel{box-shadow:0 16px 44px rgba(7,23,22,.07);transition:border-color .2s ease,box-shadow .2s ease}
body[data-calculator] .results-panel{position:relative;border-color:color-mix(in srgb,var(--mint-dark) 25%,var(--border))}
body[data-calculator] .results-panel::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,var(--mint-dark),var(--mint),var(--gold));z-index:2}
body[data-calculator] .result-hero{position:relative;overflow:hidden}
body[data-calculator] .result-hero::after{content:"";position:absolute;width:150px;height:150px;border-radius:50%;right:-70px;top:-80px;border:1px solid color-mix(in srgb,var(--gold) 38%,transparent);pointer-events:none}
.result-hero output,.result-item output,.result-item strong,.compare-main,.premium-result-dock strong{font-variant-numeric:tabular-nums lining-nums}
.button-row .premium-favorite[aria-pressed="true"]{background:color-mix(in srgb,var(--gold) 13%,var(--surface));border-color:color-mix(in srgb,var(--gold) 48%,var(--border));color:var(--text)}
.button-row .premium-compare-button{background:color-mix(in srgb,var(--mint) 13%,var(--surface))}

.formula-copy-wrap{position:relative;margin:16px 0}
.formula-copy-wrap code{margin:0;padding-right:122px!important}
.formula-copy-button{position:absolute;right:8px;top:8px;min-height:34px;padding:6px 9px;border:1px solid var(--border);border-radius:8px;background:var(--surface);color:var(--muted);font-size:.76rem;font-weight:800;box-shadow:var(--shadow-sm)}
.formula-copy-button:hover,.formula-copy-button:focus-visible{color:var(--text);border-color:var(--focus)}
.premium-copy-fallback{position:fixed;left:-9999px;top:0;width:1px;height:1px;opacity:0}

.compare-section{padding:0 0 18px}
.compare-section[hidden]{display:none}
.compare-section>.container{padding:26px;border:1px solid var(--border);border-radius:24px;background:linear-gradient(145deg,color-mix(in srgb,var(--mint) 7%,var(--surface)),var(--surface));box-shadow:var(--shadow-sm)}
.compare-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:18px}
.compare-head h2{font-size:clamp(1.45rem,3vw,2rem);letter-spacing:-.035em;margin:10px 0 4px}
.compare-head p{margin:0;color:var(--muted);max-width:690px}
.compare-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.compare-card{padding:17px;border:1px solid var(--border);border-radius:16px;background:var(--surface);min-width:0}
.compare-card-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.compare-index{font-size:.76rem;font-weight:850;text-transform:uppercase;letter-spacing:.08em;color:var(--mint-dark)}
html[data-theme="dark"] .compare-index{color:var(--mint)}
.compare-remove{width:34px;height:34px;min-height:34px}
.compare-main{display:block;font-size:clamp(1.35rem,3vw,2rem);line-height:1.05;letter-spacing:-.035em;margin:14px 0 16px;overflow-wrap:anywhere}
.compare-card dl{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 14px;margin:0 0 16px;font-size:.78rem}
.compare-card dt{color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.compare-card dd{margin:0;font-weight:750;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.personal-tools{padding-top:18px;padding-bottom:22px}
.personal-tools .section-head.compact{margin-bottom:13px;align-items:center}
.personal-tools .section-head.compact h2{font-size:clamp(1.25rem,2.5vw,1.65rem)}
.personal-tools .section-head.compact p{font-size:.88rem;margin-top:3px}
.personal-tool-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.personal-tool{display:flex;align-items:center;gap:11px;min-width:0;padding:13px 14px;border:1px solid var(--border);border-radius:14px;background:var(--surface);box-shadow:var(--shadow-sm);transition:transform .16s ease,border-color .16s ease}
.personal-tool:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--mint-dark) 38%,var(--border))}
.personal-tool-mark{display:grid;place-items:center;flex:0 0 32px;width:32px;height:32px;border-radius:10px;background:var(--surface-2);color:var(--gold);font-weight:900}
.personal-tool>span:last-child{min-width:0}
.personal-tool strong,.personal-tool small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.personal-tool strong{font-size:.86rem}
.personal-tool small{font-size:.73rem;color:var(--muted);margin-top:2px}

.premium-filter-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:-6px 0 22px}
.premium-filter-bar .chip-button[aria-pressed="true"]{background:var(--deep);border-color:var(--deep);color:white}
html[data-theme="dark"] .premium-filter-bar .chip-button[aria-pressed="true"]{background:var(--mint);border-color:var(--mint);color:#071716}
.premium-filter-count{margin-left:auto;color:var(--muted);font-size:.8rem;font-weight:750}

.premium-result-dock{position:fixed;left:14px;right:110px;bottom:14px;z-index:72;display:none;align-items:center;justify-content:space-between;gap:10px;padding:10px 11px 10px 14px;border:1px solid color-mix(in srgb,var(--mint-dark) 28%,var(--border));border-radius:15px;background:color-mix(in srgb,var(--surface) 94%,transparent);backdrop-filter:blur(18px);box-shadow:0 16px 46px rgba(7,23,22,.18);transition:transform .2s ease,opacity .2s ease}
.premium-result-dock.is-hidden{opacity:0;transform:translateY(18px);pointer-events:none}
.premium-result-dock>div:first-child{min-width:0}
.premium-result-dock span{display:block;color:var(--muted);font-size:.67rem;text-transform:uppercase;letter-spacing:.07em;font-weight:850;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.premium-result-dock strong{display:block;font-size:1.03rem;line-height:1.15;margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.premium-result-dock>div:last-child{display:flex;gap:5px;flex:0 0 auto}

.premium-v12-ready .tool-card{isolation:isolate}
.premium-v12-ready .tool-card::before{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 1px 0 color-mix(in srgb,var(--surface) 75%,white);pointer-events:none;z-index:-1}
.premium-v12-ready .input-wrap{transition:border-color .15s ease,box-shadow .15s ease,background .15s ease}
.premium-v12-ready .input-wrap:hover{border-color:color-mix(in srgb,var(--mint-dark) 25%,var(--border))}
.premium-v12-ready .side-card{box-shadow:var(--shadow-sm)}
.premium-v12-ready .faq-item{content-visibility:auto;contain-intrinsic-size:110px}

@media(max-width:1050px){
  .personal-tool-list{grid-template-columns:repeat(3,minmax(0,1fr))}
  .compare-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  html{scroll-padding-top:128px}
  .premium-jumpbar{top:64px}
  .premium-jumpbar .container{width:100%;padding-left:16px;padding-right:16px}
  body[data-calculator] .calculator-capabilities .container{min-height:42px;font-size:.76rem;gap:7px 12px}
  .compare-section>.container{width:min(calc(100% - 24px),var(--max));padding:18px;border-radius:19px}
  .compare-head{align-items:start;flex-direction:column;gap:12px}
  .compare-grid{grid-template-columns:1fr}
  .personal-tool-list{display:flex;overflow:auto;scroll-snap-type:x proximity;padding-bottom:5px;scrollbar-width:none}
  .personal-tool-list::-webkit-scrollbar{display:none}
  .personal-tool{flex:0 0 min(82vw,300px);scroll-snap-align:start}
  .premium-filter-count{width:100%;margin-left:0}
  .premium-result-dock{display:flex}
  .formula-copy-wrap code{padding-right:16px!important;padding-top:52px!important}
  .formula-copy-button{left:8px;right:auto}
  body[data-calculator]{padding-bottom:76px}
}
@media(max-width:420px){
  .premium-result-dock{right:92px;left:8px;bottom:8px;padding:9px 9px 9px 11px}
  .premium-result-dock .button{padding:7px 9px;font-size:.76rem}
  .premium-result-dock .button.ghost{display:none}
  .compare-card dl{grid-template-columns:1fr}
  .compare-card dd{max-width:none;margin-bottom:5px}
}
@media(prefers-reduced-motion:reduce){
  .personal-tool,.premium-result-dock{transition:none}
}