body{background:linear-gradient(90deg,#6ca1a9 0%,#2424dd 35%,#00d4ff 100%);font-family:Arial,Helvetica,sans-serif}h1{text-align:center;color:#ecf3f3cc}*{box-sizing:border-box}.card{color:#fff;background:#1e1e2f;border-radius:20px;width:min(500px,100%);margin:40px auto;font-family:Arial,sans-serif;box-shadow:0 10px 25px #0000004d}.card-body{padding:15px}.display-result{text-align:right;background:#63a079;border-radius:10px;flex-direction:column;justify-content:flex-end;gap:4px;min-height:70px;margin-bottom:15px;padding:20px;display:flex}.display-result__expr{color:#ffffffb3;word-break:break-all;min-height:18px;font-size:13px}.display-result__res{word-break:break-all;font-size:24px}.operator{gap:10px;display:flex}.card-numbers{flex:2;grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.card-numbers.symbole{flex:2}.card-numbers.symbole .keypad{background-color:#654adb94}.card-signes{flex:1;gap:8px;display:grid}.keypad,.signe-item{cursor:pointer;border:none;border-radius:10px;width:100%;min-width:0;padding:15px 10px;font-size:16px;transition:all .2s}.keypad{color:#fff;background:#2d2d44}.keypad.calculate{color:#fff;background:#25c305}.keypad:hover{background:#3d3d5c}.card-numbers.symbole .keypad:hover{background-color:#654adbcc}.signe-item{color:#fff;background:#ff9500;font-weight:700}.signe-item:hover{background:#e08900}@media (width<=540px){.card{border-radius:14px;margin:16px auto}.card-body{padding:10px}.operator,.card-numbers,.card-numbers.symbole,.card-signes{gap:6px}.keypad,.signe-item{border-radius:8px;padding:12px 6px;font-size:14px}.display-result__res{font-size:20px}}@media (width<=380px){.card{border-radius:10px;margin:8px auto}.card-body{padding:8px}.operator,.card-numbers,.card-numbers.symbole,.card-signes{gap:4px}.keypad,.signe-item{border-radius:6px;padding:10px 4px;font-size:12px}.display-result{min-height:55px;padding:12px}.display-result__res{font-size:18px}.display-result__expr{font-size:11px}}.card-value,.result{justify-content:center;align-items:center;height:200px;margin-top:20px;display:flex}.body-value{grid-template-columns:(2,1fr);background-color:#f0f8ff;border-radius:10px;width:min(500px,100%);padding:20px;display:grid}h2{grid-column:span 2;margin-bottom:25px}label{color:#00f;margin-top:10px;margin-bottom:20px}input{border:none;width:120px;height:40px;font-size:20px}.content{background-color:#d0e0db;border-radius:12px;flex-direction:column;align-items:center;width:min(500px,100%);display:flex}.ev-value{color:#18b122;padding:15px 20px 20px;font-size:35px;font-weight:700}.evolution{color:#4dcd16;font-size:larger}
