.carbon-form .form-row { display: flex; gap: 8px; }
.carbon-form .input-wrap { flex: 1; }
.carbon-loading-card { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 32px; }

.carbon-grade-wrap { display: flex; align-items: center; gap: 20px; margin-bottom: 24px; flex-wrap: wrap; }
.carbon-grade { width: 72px; height: 72px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 26px; font-weight: 900; flex-shrink: 0; color: #fff; }
.carbon-grade-Ap { background: #059669; }
.carbon-grade-A  { background: #10b981; }
.carbon-grade-B  { background: #34d399; color: #0b0d14; }
.carbon-grade-C  { background: #fbbf24; color: #0b0d14; }
.carbon-grade-D  { background: #f97316; }
.carbon-grade-E  { background: #ef4444; }
.carbon-grade-F  { background: #dc2626; }
.carbon-grade-unknown { background: var(--surface3); font-size: 18px; }

.carbon-url { font-size: 18px; font-weight: 700; margin: 0 0 4px; word-break: break-all; }
.carbon-summary { font-size: var(--fs-sm); color: var(--muted); margin: 0; }

.carbon-stats-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 12px; margin-bottom: 20px; }
.carbon-stat { background: var(--surface2); border: 1px solid var(--border); border-radius: var(--radius); padding: 14px 16px; }
.carbon-stat-num { font-size: 22px; font-weight: 700; color: var(--accent); display: block; margin-bottom: 4px; }
.carbon-stat-label { font-size: var(--fs-xs); color: var(--muted); }

.carbon-comparison { background: var(--surface2); border: 1px solid var(--border); border-radius: var(--radius); padding: 14px 16px; margin-bottom: 16px; font-size: var(--fs-sm); }
.carbon-comparison-bar { height: 8px; border-radius: 4px; background: var(--border); margin: 8px 0; overflow: hidden; }
.carbon-comparison-fill { height: 100%; background: var(--green); border-radius: 4px; transition: width .8s ease; }

.carbon-hosting { display: flex; align-items: center; gap: 8px; font-size: var(--fs-sm); }
.carbon-hosting-label { color: var(--muted); }
.carbon-hosting-yes { color: var(--green); font-weight: 600; }
.carbon-hosting-no  { color: var(--red); font-weight: 600; }

.carbon-tips-title { font-size: var(--fs-base); font-weight: 700; margin: 0 0 16px; }
.carbon-tips { display: flex; flex-direction: column; gap: 10px; }
.carbon-tip { display: flex; gap: 12px; align-items: flex-start; padding: 10px 14px; background: var(--surface2); border: 1px solid var(--border); border-radius: var(--radius-sm); font-size: var(--fs-sm); }
.carbon-tip-icon { font-size: 18px; flex-shrink: 0; line-height: 1.5; }
.carbon-tip-text { color: var(--text); line-height: 1.5; }
