.epc-widget { max-width: 980px; margin: 24px auto; background: #fff; border-radius: 16px; box-shadow: 0 8px 24px rgba(0,0,0,.06); padding: 16px; }
.epc-header { text-align: center; margin-bottom: 8px; }
.epc-title { font-size: 28px; margin: 4px 0; font-weight: 700; }
.epc-subtitle { color: #6b7280; margin: 0 auto 8px; }

.epc-card { background: #f8fafc; border-radius: 12px; padding: 16px; }
.epc-tabs { display: flex; gap: 6px; background: #f3f4f6; padding: 6px; border-radius: 10px; margin-bottom: 12px; }
.epc-tab { flex: 1; padding: 10px 12px; border-radius: 8px; border: none; cursor: pointer; background: transparent; color: #4b5563; font-weight: 600; }
.epc-tab--active { background: #2563eb; color: #fff; }

.epc-grid { display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 900px) { .epc-grid { grid-template-columns: 1fr 1fr; } }

.epc-col { display: flex; flex-direction: column; gap: 12px; }

.epc-panel { display: none; }
.epc-panel--active { display: block; }

.epc-field { display: flex; flex-direction: column; gap: 8px; }
.epc-label { font-size: 14px; color: #374151; }
.epc-input { width: 100%; padding: .75rem .9rem; border: 1px solid #d1d5db; border-radius: 10px; outline: none; }
.epc-input:focus { border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37,99,235,.15); }

.epc-result { background: #eff6ff; border-radius: 12px; padding: 16px; text-align: center; }
.epc-result-head { font-weight: 700; color: #1d4ed8; margin-bottom: 8px; }
.epc-result-value { font-size: 32px; font-weight: 800; color: #1d4ed8; }
.epc-result-desc { font-size: 14px; color: #4b5563; margin-top: 6px; }

.epc-note { margin-top: 10px; color: #374151; font-size: 13px; }
.epc-ul { margin: 6px 0; padding-left: 18px; }
.epc-section-title { font-size: 18px; margin: 0 0 8px; }
.epc-section-sub { font-size: 16px; margin: 10px 0 6px; }
.epc-content { margin-top: 14px; }