.ftd-calc {max-width: 300px;margin: 40px auto;background: #f9f9f9;border: 2px solid #ccc;padding: 15px;border-radius: 10px;font-family: Arial,sans-serif;box-shadow: 0 4px 12px rgba(0,0,0,.08);}
.ftd-calc .fraction-row {display: flex;justify-content: center;align-items: center;gap: 10px;margin-bottom: 20px;}
.ftd-calc .fraction-input {display: flex;flex-direction: column;align-items: center;}
.ftd-calc .fraction-input input, .ftd-calc .whole {width: 50px;padding: 8px;text-align: center;font-size: 16px;border-radius: 6px;border: 1px solid #ccc;appearance: none;}
.ftd-calc .fraction-input hr {width: 100%;border: none;border-top: 2px solid #000;margin: 4px 0;}
.ftd-calc .button-row {text-align: center;margin-bottom: 20px;}
.ftd-calc button {padding: 10px 20px;border: none;border-radius: 8px;font-size: 16px;margin: 0 10px;cursor: pointer;color: white;}
.ftd-calc #calculateBtn {background-color: #4caf50;}
.ftd-calc #clearBtn {background-color: #a6acaf;}
.ftd-calc .result {text-align: center;font-size: 20px;font-weight: bold;margin-top: 10px;}
.ftd-calc #resultMark {font-size: 28px;color: #4caf50;}
.ftd-calc .steps {margin-top: 10px;font-size: 14px;font-weight: normal;color: #333;}