.legend{border-bottom:1px solid var(--border);padding:28px 0 32px}.legend h2{font-size:var(--text-h4);letter-spacing:-.02em;margin:0 0 16px}.legend ul{gap:8px;margin:0;padding:0;list-style:none;display:grid}.legend__item{color:var(--ink-soft);font-size:var(--text-small);grid-template-columns:20px 1fr;align-items:start;gap:12px;line-height:1.5;display:grid}.legend__item svg{margin-top:2px}.legend__item b{color:var(--ink);font-weight:700}.legend__item--aprova svg{color:var(--ink)}.legend__item--atencao svg{color:var(--viva-orange)}.legend__item--reprova svg{color:var(--viva-coral-readable)}.color-rows{gap:8px;display:grid}.color-row{border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface)}.color-row.is-targeted{border-color:var(--viva-cyan);box-shadow:inset 0 0 0 1px var(--viva-cyan)}.color-row__summary{cursor:pointer;border-radius:var(--radius-md);min-height:56px;transition:background var(--transition-fast);grid-template-columns:40px minmax(140px,1fr) 1.4fr auto 20px;align-items:center;gap:16px;padding:8px 16px;list-style:none;display:grid}.color-row__summary::-webkit-details-marker{display:none}.color-row__summary:hover{background:color-mix(in srgb, var(--ink) 4%, transparent)}.color-row[open] .color-row__summary{border-bottom:1px solid var(--border-soft);border-end-end-radius:0;border-end-start-radius:0}.color-row__chip{border-radius:var(--radius-sm);width:40px;height:40px;box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--ink) 20%, transparent)}.color-row__id{flex-direction:column;gap:2px;min-width:0;display:flex}.color-row__id strong{font-size:var(--text-small);font-weight:800}.color-row__id code{color:var(--muted);font-size:var(--text-caption)}.color-row__role{color:var(--ink-soft);font-size:var(--text-small);line-height:1.4}.color-row__verdict{white-space:nowrap;font-size:var(--text-small);align-items:center;gap:8px;font-weight:700;display:inline-flex}.color-row__verdict--aprova{color:var(--ink-soft)}.color-row__verdict--atencao{color:var(--viva-orange)}.color-row__verdict--reprova{color:var(--viva-coral-readable)}.color-row__verdict--neutro{color:var(--muted);font-weight:500}.color-row__caret{color:var(--muted);transition:transform var(--transition-fast)}.color-row[open] .color-row__caret{transform:rotate(180deg)}.color-row__detail{gap:16px;padding:20px 16px 16px;display:grid}.color-row__matrix{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;display:grid}.color-row__theme h4{color:var(--muted);font-size:var(--text-caption);letter-spacing:.08em;text-transform:uppercase;margin:0 0 8px;font-weight:700}.color-row__theme ul{gap:4px;margin:0;padding:0;list-style:none;display:grid}.color-row__cell{border-radius:var(--radius-sm);background:var(--surface-raised);font-size:var(--text-small);grid-template-columns:16px 1fr auto auto;align-items:center;gap:8px;padding:8px;display:grid}.color-row__cell code{color:var(--ink-soft)}.color-row__ratio{font-variant-numeric:tabular-nums;font-weight:800}.color-row__level{color:var(--muted);font-size:var(--text-caption)}.color-row__cell--aprova svg{color:var(--ink)}.color-row__cell--atencao svg,.color-row__cell--atencao .color-row__ratio{color:var(--viva-orange)}.color-row__cell--reprova svg,.color-row__cell--reprova .color-row__ratio{color:var(--viva-coral-readable)}.color-row__note,.color-row__usage,.color-row__pair{color:var(--ink-soft);font-size:var(--text-small);max-width:70ch;margin:0;line-height:1.6}.color-row__note{color:var(--muted)}.color-row__pair code{color:var(--ink);font-weight:700}.color-row__actions{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.color-row__rgb{color:var(--muted);font-size:var(--text-caption);font-variant-numeric:tabular-nums}.token-table{border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden}.token-table__head,.token-table__row{font-size:var(--text-small);grid-template-columns:1.1fr 1.6fr 1fr 1fr;align-items:center;gap:16px;padding:12px 16px;display:grid}.token-table__head{background:var(--surface);color:var(--muted);font-size:var(--text-caption);letter-spacing:.08em;text-transform:uppercase;font-weight:700}.token-table__row+.token-table__row{border-top:1px solid var(--border-soft)}.token-table__row code{color:var(--ink);font-weight:700}.token-table__row>span{color:var(--ink-soft)}.token-table__value{font-variant-numeric:tabular-nums;align-items:center;gap:8px;display:inline-flex}.token-table__value i{border-radius:var(--radius-sm);width:20px;height:20px;box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--ink) 20%, transparent)}.proportion-section{padding:72px 0}.proportion-bar{border:1px solid var(--border);border-radius:var(--radius-md);grid-template-columns:7fr 2fr 1fr;height:92px;margin-top:24px;display:grid;overflow:hidden}.proportion-bar span{box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--ink) 12%, transparent)}.proportion-bar span:first-child{background:var(--slate-100)}.proportion-bar span:nth-child(2){background:var(--viva-navy)}.proportion-bar span:nth-child(3){background:linear-gradient(90deg, var(--viva-cyan), var(--viva-coral))}.proportion-legend{color:var(--ink-soft);font-size:var(--text-small);flex-wrap:wrap;gap:8px 24px;margin:16px 0 0;padding:0;font-weight:700;list-style:none;display:flex}.proportion-legend li{align-items:center;gap:8px;display:inline-flex}.proportion-legend i{border-radius:var(--radius-sm);width:16px;height:16px;box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--ink) 12%, transparent)}.proportion-legend__neutro{background:var(--slate-100)}.proportion-legend__navy{background:var(--viva-navy)}.proportion-legend__destaque{background:linear-gradient(90deg, var(--viva-cyan), var(--viva-coral))}@media (max-width:820px){.color-row__summary{grid-template-columns:40px 1fr 20px;grid-template-areas:"chip id caret""chip role role""chip verdict verdict";row-gap:4px;padding:12px 16px}.color-row__chip{grid-area:chip;align-self:start}.color-row__id{grid-area:id}.color-row__role{grid-area:role}.color-row__verdict{white-space:normal;grid-area:verdict}.color-row__caret{grid-area:caret;align-self:start}.color-row__id{flex-flow:wrap;align-items:baseline;gap:8px}.token-table__head{display:none}.token-table__row{grid-template-columns:auto 1fr;gap:8px 12px}.token-table__row>span:nth-child(2){grid-column:2}}@media (max-width:640px){.color-row__detail{padding:16px 12px 12px}.color-row__actions .button{width:100%}.proportion-bar{height:72px}}@media (forced-colors:active){.color-row__chip,.token-table__value i,.proportion-bar span,.proportion-legend i{forced-color-adjust:none}.color-row.is-targeted{outline-offset:-2px;outline:2px solid highlight}}