/* ============================================================
   Calculator
   ============================================================ */
.calc-layout{
  display:flex;flex-direction:column;height:100%;
  background:var(--bg-window);
}
.calc-display{
  padding:14px 16px 10px;
  text-align:right;
  background:var(--bg-window-alt);
  border-bottom:1px solid var(--border);
  min-height:78px;
  display:flex;flex-direction:column;justify-content:flex-end;
}
.calc-history{
  font-size:12px;color:var(--text-secondary);min-height:16px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.calc-value{
  font-size:30px;font-weight:300;letter-spacing:.5px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.calc-buttons{
  flex:1;display:grid;grid-template-columns:repeat(4,1fr);
  gap:1px;background:var(--border);
}
.calc-btn{
  background:var(--bg-window);border:0;color:var(--text);
  font-size:16px;font-weight:500;
  display:flex;align-items:center;justify-content:center;
  transition:background .1s;
  min-height:44px;
}
.calc-btn:hover{background:var(--bg-hover)}
.calc-btn:active{background:var(--bg-active)}
.calc-btn.fn{background:var(--bg-window-alt);color:var(--text-secondary);font-size:14px}
.calc-btn.op{background:var(--bg-active);color:var(--accent);font-weight:600}
.calc-btn.eq{background:var(--accent);color:#fff;font-weight:700;font-size:18px}
.calc-btn.eq:hover{background:var(--accent-hover)}
.calc-btn.wide{grid-column:span 2}