/* page-specific rules only – global calculator.css untouched */

/* ─ dimension box ─ */
.dim-inputs       {text-align:center;margin-bottom:20px;}
.dim-inputs label {margin:0 10px;font-weight:500;}
.dim-inputs input {width:60px;padding:4px;font-size:1rem;text-align:center;}
.dim-inputs button{
  padding:2px 6px;
  font-size:.8rem;
  cursor:pointer;
  border-radius:4px;
  border:1px solid #777;
}

/* ─ matrices layout ─ */
.matrices-area{display:flex;align-items:center;justify-content:center;margin-bottom:20px;}
.matrix-block{text-align:center;margin:0 10px;}
.matrix-title{margin-bottom:8px;font-weight:600;}
.operator{font-size:2rem!important;margin:0 20px;display:flex;align-items:center;justify-content:center;}

/* ─ wrapper + brackets ─ */
.matrix-wrapper{
  --cell-size:40px;
  display:inline-block;
  position:relative;
  padding:8px;
  vertical-align:middle;
}
.matrix-wrapper table{border-collapse:separate;border-spacing:1px;}
.matrix-cell{width:var(--cell-size);height:var(--cell-size);padding:0;border:1px solid #999;box-sizing:border-box;}
.cell-input{width:100%;height:100%;border:none;padding:0;margin:0;text-align:center;font-size:1rem;background:transparent;outline:none;box-sizing:border-box;}
.matrix-wrapper::before,
.matrix-wrapper::after{content:"";position:absolute;top:0;bottom:0;width:4px;border-top:2px solid #333;border-bottom:2px solid #333;}
.matrix-wrapper::before{left:0;border-left:2px solid #333;border-radius:4px 0 0 4px;}
.matrix-wrapper::after{right:0;border-right:2px solid #333;border-radius:0 4px 4px 0;}

/* ─ answer line ─ */
.answer-box{margin-bottom:16px;display:flex;align-items:center;gap:8px;font-weight:bold;text-align:left;}
.answer-box strong{font-weight:700;}

/* ─ solve button hover ─ */
.solve-button:hover{background-color:#2980b9;}