.uc-desc { font-size: 0.9em; color: var(--mm-text-muted); margin-bottom: 20px; line-height: 1.4; }
.uc-input-section { background: var(--mm-bg-light); padding: 16px; border-radius: var(--mm-radius); border: 1px solid var(--mm-border-light); margin-bottom: 20px; }
.uc-row { display: flex; gap: 16px; margin-top: 12px; }
.uc-half { flex: 1; }
.uc-field label { display: block; margin-bottom: 6px; font-size: 0.9em; font-weight: 600; color: var(--mm-text-heading); }
.uc-select, .uc-input { width: 100%; padding: 10px; border: 1px solid var(--mm-border-input); border-radius: var(--mm-radius); background: #ffffff; font-family: inherit; color: var(--mm-text-dark); font-size: 0.95em; box-sizing: border-box; }
.uc-select:focus, .uc-input:focus { outline: none; border-color: var(--mm-primary); box-shadow: 0 0 0 1px var(--mm-primary); }
.uc-select optgroup { font-weight: bold; color: var(--mm-primary); }
.uc-output-section { border: 1px solid var(--mm-border); border-radius: var(--mm-radius); padding: 0; overflow: hidden; }
.uc-output-header { background: var(--mm-bg-highlight); padding: 12px 16px; border-bottom: 1px solid var(--mm-border); }
.uc-output-header h4 { margin: 0; color: var(--mm-primary-hover); font-size: 0.95em; }
.uc-main-result { text-align: center; padding: 20px; border-bottom: 1px dashed var(--mm-border); }
.uc-main-result span { font-size: 2.5em; font-weight: bold; color: var(--mm-primary); line-height: 1; }
.uc-main-result small { font-size: 1.2em; color: var(--mm-text-muted); margin-left: 4px; }
.uc-grid { display: grid; grid-template-columns: repeat(2, 1fr); padding: 16px; gap: 12px; }
.uc-grid-item { display: flex; justify-content: space-between; padding-bottom: 8px; border-bottom: 1px dashed var(--mm-border-light); font-size: 0.95em; }
.uc-grid-item:nth-last-child(-n+2) { border-bottom: none; padding-bottom: 0; }
.uc-label { color: var(--mm-text-muted); }
.uc-grid-item strong { color: var(--mm-text-heading); }
.uc-hidden { display: none !important; }
.uc-practical-note { background: var(--mm-bg-highlight); padding: 12px 16px; border-top: 1px solid var(--mm-border); font-size: 0.9em; color: var(--mm-primary-hover); }
.uc-note-icon { margin-right: 6px; }

@media (max-width: 600px) {
  .uc-row { flex-direction: column; }
  .uc-grid { grid-template-columns: 1fr; }
}