.dg-wrap { max-width: 760px; margin: 0 auto; padding: 40px 20px; font-family: system-ui, "Apple SD Gothic Neo", sans-serif; color: #1a1a1a; }
.dg-sub { color: #555; }
#dg-input { width: 100%; box-sizing: border-box; padding: 14px; border: 1px solid #ddd; border-radius: 10px; font-size: 15px; }
.dg-btn { margin-top: 14px; padding: 14px 22px; background: #03c75a; color: #fff; border: 0; border-radius: 10px; font-size: 16px; cursor: pointer; }
.dg-btn:disabled { opacity: .5; cursor: default; }
.dg-error { color: #d33; }
.dg-ok { color: #03862f; }
.dg-hero { display: flex; align-items: baseline; gap: 18px; margin: 24px 0; }
.dg-score { font-size: 56px; font-weight: 800; }
.dg-score small { font-size: 22px; color: #888; }
.dg-grade { font-size: 40px; font-weight: 800; color: #03c75a; }
.dg-badge { font-size: 12px; font-weight: 500; color: #888; background: #f0f0f0; padding: 3px 8px; border-radius: 6px; vertical-align: middle; }
.dg-bar { display: flex; align-items: center; gap: 8px; margin: 6px 0; }
.dg-bar-label { width: 80px; font-size: 14px; }
.dg-bar-fill { height: 16px; background: #03c75a; border-radius: 4px; }
.dg-reply { border: 1px solid #eee; border-radius: 10px; padding: 14px; margin: 10px 0; }
.dg-reply-q { color: #555; font-size: 14px; }
.dg-reply-a { margin-top: 8px; font-weight: 500; }
.dg-cta { margin-top: 36px; padding: 24px; background: #f7faf8; border-radius: 14px; text-align: center; }
.dg-cta input { padding: 12px; border: 1px solid #ccc; border-radius: 8px; width: 240px; max-width: 100%; }
.dg-cta .dg-btn { margin-top: 10px; }