.converter { max-width: 700px; margin: 0 auto 40px; }
  .copy { font-size: 14px; color: #555; margin-bottom: 5px; display:flex; align-items:center; gap:6px; text-align:center; justify-content:center; }
  .copy.left { justify-content:flex-start; text-align:left; }

  .timer-container { position:relative; width:250px; height:250px; margin:0 auto 20px; }
  .timer-container svg {
  width:250px;
  height:250px;
  transform: rotate(-90deg);
}
  .circle-bg { fill:none; stroke:#eee; stroke-width:10; }
  .circle-progress {
    fill:none; stroke:#4caf50; stroke-width:10; stroke-linecap:round;
    stroke-dasharray: 723; stroke-dashoffset: 723;
    transition: stroke-dashoffset 1s linear;
  }

  #time {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 36px;
    font-weight: bold;
    color: #333;
    text-align: center;
    width: 180px;
  }

  #timeInput {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 26px;
    background: #fff;
    border: 2px solid #d7e2fa;
    border-radius: 6px;
    padding: 5px;
    width: 130px;
    text-align: center;
    -webkit-appearance: none; appearance: none;
    direction:ltr;
  }
  #timeInput::-webkit-datetime-edit,
  #timeInput::-webkit-date-and-time-value,
  #timeInput::-webkit-datetime-edit-fields-wrapper,
  #timeInput::-webkit-datetime-edit-hour-field,
  #timeInput::-webkit-datetime-edit-minute-field,
  #timeInput::-webkit-datetime-edit-ampm-field { text-align:center; }

  .row-layout { display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:10px; margin-bottom:15px; }
  .btn, #startPauseButton {
    padding:6px 10px; font-size:15px; font-weight:500; border-radius:6px; cursor:pointer;
    border:2px solid #ccc; background:#eeeeee; color:#222; transition:background .2s;
  }
  .btn.reset { background:#f44336; color:#fff; border-color:#f44336; }
  .btn.reset.large { flex-grow:1; max-width:140px; }
  .btn.edit { background:#9e9e9e; color:#fff; border-color:#9e9e9e; }
  #startPauseButton { width:100%; max-width:200px; font-size:16px; color:#fff; }
  #startPauseButton.start, #startPauseButton.resume { background:#2196f3; border-color:#2196f3; }
  #startPauseButton.pause { background:#ffd700; color:#000; border-color:#ffd700; }
  #startPauseButton:disabled { opacity:.5; cursor:not-allowed; }

  .hidden { display:none; }