/* AQ Calculator Suite - Scoped CSS (.aqms-*) - Blue accent */
.aqms-wrapper { display:flex; justify-content:center; padding:20px; box-sizing:border-box; }
.aqms-card {
  width:100%;
  max-width:960px;
  background: linear-gradient(180deg,#f8fbff,#eef6ff);
  border-radius:14px;
  box-shadow: 0 12px 30px rgba(5,35,80,0.12);
  overflow:hidden;
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  border:1px solid rgba(10,60,120,0.06);
  transform-origin:center;
  animation: aqms-entry 420ms ease;
}
@keyframes aqms-entry { from { transform: translateY(6px); opacity:0 } to { transform:none; opacity:1 } }

.aqms-header { display:flex; align-items:center; justify-content:space-between; padding:14px 18px; gap:8px; }
.aqms-title { font-weight:700; color:#03396c; font-size:18px; }
.aqms-controls { display:flex; align-items:center; gap:10px; }
#aqms-mode-select { padding:8px 10px; border-radius:8px; border:1px solid rgba(3,57,108,0.08); background:white; font-size:14px; }
#aqms-sound-toggle { background:transparent; border:none; font-size:18px; cursor:pointer; padding:6px; border-radius:8px; }
#aqms-sound-toggle[aria-pressed="false"] { opacity:0.5; }

.aqms-container { padding:16px; display:flex; justify-content:center; align-items:flex-start; min-height:360px; }

/* Calculator common shell */
.aqms-calc {
  width:100%;
  max-width:760px;
  display:grid;
  grid-template-columns: 1fr 340px;
  gap:20px;
  align-items:start;
}
@media (max-width:900px) {
  .aqms-calc { grid-template-columns: 1fr; }
}

/* Left — Display and keys area (primary) */
.aqms-panel {
  background: linear-gradient(180deg,#0b2a4a 0,#062033 100%);
  color: #dbefff;
  border-radius:12px;
  padding:14px;
  box-shadow: inset 0 -6px 18px rgba(0,0,0,0.25);
}

/* LCD display */
.aqms-display {
  background: linear-gradient(180deg,#112734,#081218);
  border-radius:8px;
  padding:12px 14px;
  font-family: "IBM Plex Sans", monospace;
  min-height:64px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  box-shadow: 0 8px 22px rgba(2,8,20,0.45);
  margin-bottom:12px;
  position:relative;
}
.aqms-display .aqms-expr { font-size:13px; color:rgba(200,225,255,0.6); min-height:16px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.aqms-display .aqms-value { font-size:28px; font-weight:700; text-align:right; color:#e8fbff; letter-spacing:0.6px; }

/* Keys grid */
.aqms-keys {
  display:grid;
  grid-template-columns: repeat(5,1fr);
  gap:9px;
}
.aqms-key {
  background: linear-gradient(180deg,#e6f3ff,#cfeaff);
  border-radius:10px;
  border: 1px solid rgba(3,57,108,0.06);
  padding:12px;
  font-weight:600;
  text-align:center;
  cursor:pointer;
  user-select:none;
  box-shadow: 0 6px 10px rgba(2,18,39,0.08);
  transition: transform 120ms ease, box-shadow 120ms;
  color:#03396c;
}
.aqms-key:active { transform: translateY(2px) scale(0.997); box-shadow:0 4px 6px rgba(2,18,39,0.06); }
.aqms-key.fn { background: linear-gradient(180deg,#dfeeff,#c7e7ff); color:#05345b; }
.aqms-key.op { background: linear-gradient(180deg,#fdd9d9,#ffd0d0); color:#6b1b1b; }
.aqms-key.equal { background: linear-gradient(180deg,#0077ff,#0057d0); color:white; grid-column:span 2; font-size:16px; }

/* Right panel (secondary calculators/inputs) */
.aqms-side {
  background: white;
  border-radius:12px;
  padding:12px;
  box-shadow: 0 8px 20px rgba(15,40,80,0.06);
}
.aqms-side h4 { margin:0 0 8px 0; color:#022a50; font-size:14px; }

/* Simple card layout for other calculators */
.aqms-small { display:flex; flex-direction:column; gap:8px; align-items:stretch; }
.aqms-input, .aqms-select { padding:8px 10px; border-radius:8px; border:1px solid rgba(3,57,108,0.08); font-size:14px; }

/* Subtle animations */
.aqms-fade { animation: aqms-fade 260ms ease; }
@keyframes aqms-fade { from { opacity:0; transform: translateY(6px) } to { opacity:1; transform:none } }

/* Programmer mode grid tweaks */
.aqms-programmer .aqms-keys { grid-template-columns: repeat(4,1fr); }
.aqms-programmer .aqms-key.hex { background: linear-gradient(180deg,#fff7e6,#fff2d1); color:#7a4300; }

/* Small helper styles */
.aqms-row { display:flex; gap:8px; }
.aqms-btn { padding:10px 12px; border-radius:8px; border:1px solid rgba(3,57,108,0.06); background:white; cursor:pointer; }
.aqms-note { color: #5b6d80; font-size:13px; padding:12px; }
